jquery 를 이용한 말풍선 플러그인이다. 마우스 오버 또는 클릭 시 도움말 또는 알림말을 보여줄 때 유용하게 사용될 수 있다. 라이센스 : MIT Examples 해당 플러그인을 사용하는 자세한 방법 및 내용은 아래 링크를 참조하세요. 기본적인 사용 방법 및 데모 소스들이 많으니 충분히 쉽게 사용할 수 있을꺼라 생각합니다. 링크 : http://vadikom.com/demos/poshytip/ 도움이 되셨다면 공감을 부탁드립니다. ^^

파일명 구하기 예제입니다. jquery 사용은 필수이다. 파일 태그에서 파일명을 구하는 방법이다. 태그 : 스크립트 :

그리드 사이즈를 브라우저 화면을 늘리고 줄임에 따라 유동적으로 변경하는 예제이다. 최초 크기다 다른 창을 띄우는 것도 포함한다. 설명은 주석으로 대체한다. $(document).ready(function() { // 그리드 셋팅(설정)이 끝나고 아래 함수 호출 (lodeComplete 이 아님) // 그리드 리사이즈 gridResize("jqGrid"); // window resize에 등록 setGridResize("jqGrid"); // 최초 그리드 사이즈 조정 }); /* * 그리드 리사이즈 셋팅 - GridParam 중 width 관련한 값 (autowidth, width) 는 주석처리 * 주의사항 - gridResize 함수 중 $("#cont").width() 부분은 그리드가 그려질 div 너..

jqgrid 컬럼을 show hide (보여주거나 숨기는)기능을 구현한 예제입니다. jqgrid 사용 필수입니다. 우측 상단의 checked box로 컬럼들의 show hide를 결정한다. 모든 컬럼을 대상으로 할수도 있고 직접 입력한 컬럼을 대상으로 할 수 있다. 실행 방법 및 설명은 소스와 주석을 참고하면 쉽게 따라할 수 있을거라 생각한다. jsp 파일 jqgrid loadComplete 함수 loadComplete : function(data){ // 컬럼 속성 // var colModel = $("#jqGrid").jqGrid("getGridParam", "colModel"); // 컬럼명 // var colNames = $("#jqGrid").jqGrid("getGridParam", "colNa..

조사 내용 파일 다운로드 : 셀렉트박스 플러그(selectBox Plugin)인 모음이다. 사업 특성에 맞는 플러그인을 조사하게 되었다. 셀렉트 박스의 선택 기능 이외에 다중 선택기능, 이미지나 다른 정보들을 보여주는 기능 등의 많은 기능을 셀렉트박스에 담아야할 경우가 생겼기 때문이다. 첨부파일 내부의 각 폴더의 압축파일은 2015.04.09 일 기준으로 다운받은 샘플이니 참고하길 바란다. 각 샘플은 실행이 안 될 수 있다. (인터넷 환경, jquery 셋팅, 버전 등.....) 첨부파일 내부의 정리.xlsx 을 참고하기 바란다. jquery selectBox plugin 이름 Bootstrap Multiselect URI http://www.jqueryrain.com/?FusAX1FA GIT https..

jqGrid 그리드 페이징 바 커스터마이징(분리) 하는 예제이다. 기본적으로 jqGrid 를 사용할 수 있는 환경이 되어있다는 가정하에 작성한다 위 이미지는 기존 페이징과 새로만든 페이징을 모두 보여주는 그림이다. 둘중에 하나만 사용 가능하다. jqGrid 4.6.0 에서 진행했다. jsp에서 js , css 파일을 include해서 사용한다. 버전이나 기존 환경에 따라서 적용이 안될수 있으니 참고한다. 아이콘은 Font Awesome Icons (무료) 사용했다. http://cofs.tistory.com/32 여기를 참조하면 페이징 버튼 이미지가 에러없이 나올 수 있다. jsp $(document).ready(function(){ $(document).ready(function () { var row..

다이어그램, 차트, 관계 플러그인을 조사하고 정리한 내용이다. 1. 관계형 다이어그램 http://www.headjump.de/article/arrows-and-boxes - 특이사항 1. 단순한 계층 구조를 표현할 수 있음 (움직임 X) 2. 아주 가벼운 플러그인 3. 예제 및 API 제공 4. 적용사례 레퍼런스가 거의 없음 2. 각종 다이어그램 http://jointjs.com/demos/umlsc - 특이사항 1. 라이센스 : MLP / GNU General Public License (GPLv2) (출처 : 한국저작권위원회) 2. 예제 및 API 제공 3. 적용사례 레퍼런스가 거의 없음 - 종류 : - Finite State Machines - Organizational Charts - ER Di..

키 입력을 감지해서 허용되지 않은 입력값을 바로바로 잡아주는 예제이다. 예를 들면 전화번호를 입력 받는 곳에 꼭 문자를 집어넣는 애들이 있다. 강제로 jquery 를 이용해서 함수를 바인드해놓고 포커스와 포커스 아웃을 이용해서 자동으로 문자 하나 하나 입력이 들어왔을 때 체킹하고 잘못된 입력은 삭제하는 방법이다. 1. 사용방법은 단순히 체크하고 싶은 클레스만 지정해주면 된다. 2. js 파일을 만들어서 import한다. /* * * jquery class선택자를 이용하여 자동 formatter구현 */ // 0) common function addComma(str) { if (str == null) { return ""; } str = removeComma(str); x = str.split(".");/..

강제로 클릭한 효과를 주는 예제이다. 때때로 강제로 클릭한 효과가 필요한 경우가 있다. 또는 가끔 클릭하지 않아도 클릭이 되어야 하는 경우가 있다. jquery 의 trigger을 사용하면 된다. $("#button_id").trigger("click");

이메일 @ 이후 주소값을 셋팅하는 예제이다. jquery 사용한다. 지금도 이런 방법을 사용 할 지는 모르겠는데 고전적인 방법이긴하나 심플하다. @ 직접입력