Programming language
-
JQuery를 마지막으로 사용해서인지 자바스크립트 일부 속성을 간혹 까먹는다. 안타깝게도 입사 후 JQuery기반은 지금껏 만져본 적이 없다..그래서 이번에 가장 많이 쓴(?) document.getElementById() 속성을 기록해두려고 한다. document.getElementById('ID값') document.getElementById('LSH')는 id값이 LSH인 HTML 요소를 가져온다. 이렇게 가져온 id값을 통해 라디오 박스 또는 셀렉트 옵션값 설정, 특정 값 입력, 스타일 변경 등 다양한 행위를 할 수 있게 된다. 먼저 innerHTML에 대해 소개한다. innerHTML은 내부 HTML을 문자열로 가지고 있기 때문에 DOM을 쉽게 조작할 수 있다. ☞ DOM이란?쉽게 innerHT..
[Javascript]document.getElementById() - (1) 2018. 6. 21. -
SELECT BOXSELECT BOX를 이용해 어떤 이벤트를 실행하고자 할 때는 주로 onchange 이벤트를 사용한다.onchange는 input이나 select 등의 데이터가 변경될 때 호출되는 이벤트이다. 아래 예제는 OnChange()라는 함수를 만들어 셀렉트 박스의 인덱스 번호를 구해서 이미지를 바꿔봤다.select option의 인덱스는 0부터 시작하며 라이언을 선택하면 1, 어피치를 선택하면 2가 된다. document.getElementById("KaKaoF").selectedIndex는 KaKaoF라는 id값을 가진 SELECT BOX의 인덱스 번호를 가져온다. 그리고 document.getElementById("KaKaoF").options[인덱스 번호].value를 통해 선택된 값을 ..
[Javascript]SELECT(OPTION) 조작하기 2018. 6. 3. -
IBSheetIBSheet는 별도의 개발툴 없이 자바스크립트를 통해 각 기능을 설정함으로써 기능 구현이 가능하다.Ajax 통신을 통해 데이터를 XML 또는 JSON 형태로 받아 화면에 로딩한다. IBSheet는 여러 기능이 제공되는데,각 컬럼별 다양한 데이터 타입과 포맷을 제공한다. 이제 반은 아는 정도가 되었으려나...또 합계/소계/누계 등 숫자연산 기능도 제공한다.결과적으로 IBSheet는 DB에 저장 된 다량의 데이터를 리스트로 조회하거나 입력,수정,삭제하는 경우 유용하게 사용되는 것 같다. 오늘은 IBSheet의 함수를 이용해 특정 기능이 작동되는 데 조건을 주었다.오늘 알게 된 함수는 CellValue와 GetSelectionRows()이다. CellValue(Row, Col) 스크립트에서 사용..
[IBSheet]CellValue와 GetSelectionRows() 2018. 5. 10. -
어제 좋아요 기능 구현에 대해 포스팅을 했었다.기능 구현까지는 되기는 했다. 하지만 문제가 있다고 말했었는데.. 문제는 테이블의 INSERT였다.좋아요 테이블을 만들어 사용을 했기 때문에 반드시 Row가 있어야 했다.(기능이 정상적으로 작동한 것은 테스트용으로 몇 개의 Row를 임의로 입력해줬기 때문이다)지금 생각해보면 당연한 일이었는데 그 때는 왜그랬을까.. 어쨌든 Row를 추가시켜줘야했다.그럼 어떤 상황에서 추가를 시켜주면 좋을까 생각을 했다.회원가입 시? 아니면 게시글을 조회할 때? 좋아요를 눌렀을 때?회원가입 시는 적절하지 못했다. 왜냐하면 좋아요 테이블에는 게시글의 번호를 가져오기 때문에..여러 테스트 끝에 게시글 조회 시가 가장 적절하다고 판단했다.게시글을 조회할 때 회원 번호와 해당 게시글 ..
[JQuery+Ajax]좋아요 기능 구현 - (2) 2018. 5. 1. -
관련 소스는 https://github.com/eeesnghyun/LikeFunction에서 확인하실 수 있습니다. 학부시절 취업성공패키지로 한 학기를 대신한 국비지원교육을 받을 수 있었다.교육당시 재미삼아 개인프로젝트를 진행했었는데 그 때 만들었던 좋아요 기능을 기록에 남기려고 한다.이 기능을 구현하기 위해 3일을 넘게 애먹었던 것 같다... 내가 생각한 로직은 아래와 같다.1)유저가 게시판을 조회 한다.2)좋아요 버튼을 클릭 시 로그인 여부를 파악한다.3)회원 여부를 로그인을 통해 파악한다.(회원이라면 통과, 비회원이라면 회원가입)4)좋아요 클릭시 +1, 취소시 0 이 때, DB(좋아요 테이블을 따로 제작)에는 좋아요 번호가 PK로 등록되어 있으며 게시판 번호와 회원번호는 FK 그리고 좋아요 체크값(..
[JQuery+Ajax]좋아요 기능 구현 - (1) 2018. 4. 30. -
웹 프로젝트를 할 때 간단한 효과를 주기 위해 많이 사용했던 기술입니다. 자바스크립트를 사용해 효과를 줄 수 도 있지만 CSS를 사용해 간단히 수정했습니다. hover 속성과 transition hover는 사용자가 마우스를 올렸을 때, 효과를 주는 CSS의 한 기능이다. 여기에 transition을 사용하면 자연스러운 전환이 가능하게 된다. transition은 원하는 요소의 시간을 지연시켜 애니메이션이 가능하도록 해준다. transition의 속성 중 duration을 이용해 몇 초 동안 재생할 지 설정이 가능하다. (webkit은 구글, 사파리 브라우저에 적용을 뜻함) 현재 블로그에서 사용한 코드.. .css .area_menu .btn_cate .area_menu .btn_cate:hover{ b..
마우스 오버시 자연스러운 배경색 전환 2018. 4. 27. -
약 2~3주간 파워빌더 교육을 받았었는데 교육간에 정리해본 내용들입니다. 파워빌더의 강력한 기능으로 소개되는 데이터 윈도우(DW)는 처음 배우는 입장에서 굉장히 신선했습니다. Update Properties AllowUpdates : 체크 시 Update Properties를 입력할 수 있게 된다. Updates는 Insert문, Update문, Delete문 모두를 뜻한다. Table to Updates : 수정할 테이블 선택, 한 개의 DW는 한 개의 테이블만 수정할 수 있다. Unique key Column(s) : Primary Key를 정한다. Primary Key 버튼을 클릭하면 자동으로 잡아준다. Where Clause for Update/Delete : Update 또는 Delete문에 포..
파워빌더 정리 2018. 4. 27.