본문 바로가기

Programming/jQuery

[jQuery] jqxGrid 차트의 높이와 단위를 자동으로 jqxGrid 차트의 높이와 단위를 자동으로 {type: 'column',valueAxis : {visible: true,maxValue:'auto', // Max값을 Auto로 지정unitInterval: 5000, // 차트의 단위를 5000으로 지정formatFunction:function(value){ // 차트의 단위를 평균으로 지정return Math.round(value);},title: { text: 'GDP & Debt per Capita($) ' }},series: [{ dataField: 'GDP', displayText: 'GDP per Capita' },{ dataField: 'Debt', displayText: 'Debt per Capita' }]} 더보기
[jQuery] 화면 상단으로 이동시키기 화면 상단으로 이동시키기 function scrollToTop() { $('html, body').animate({scrollTop: 0 }, 'slow');} 더보기
[jQuery] 스크롤 값에 이벤트 주기 스크롤 값에 이벤트 주기 $(window).scroll(function(){if($(window).scrollTop() > 300){$('.side-scrolltop').fadeIn('1000');}else if($(window).scrollTop() < 300){$('.side-scrolltop').fadeOut('1000');}}); 더보기
[jQuery] 팝업창에서 다른 곳을 클릭했을때 닫기 팝업창에서 다른 곳을 클릭했을때 닫기 $(document).mouseup(function (e) {// 팝업 아이디var container = $("#popup");if (!container.is(e.target) && container.has(e.target).length === 0){container.css("display","none");}}); 더보기
[jQuery] alert 디자인을 바꿔주는 플러그인 alert 디자인을 바꿔주는 플러그인 ALERTIFY.js Alert Plug-In SetupURL : http://fabien-d.github.io/alertify.js/ 아래 폴더에 있는 라이브러리를 프로젝트에 저장lib 폴더 alertify.js, alertify.min.jsthemes 폴더 alertify.bootstrap.css, alertify.core.css, alertify.default.css Usage위에 추가한 경로에 있는 해당 라이브러리 참조Include JSInclude CSS Default Usage (기본 alert 메시지) 1. alertalertify.alert("Message"); 2. confirmalertify.confirm("Message", function (e) .. 더보기
[jQuery] form 객체를 json 형태로 만들기 form 객체를 json 형태로 만들기 HTML serialize()와 serializeArray()의 차이점 $("#form").serialize();name=seong&age=123 $("#form").serializeArray();[{"name":"name","value":"seong"},{"name":"age","value":"123"}] jquery를 확장하여 serializeArray()를 이용해 json obj 형태로 만들기 /* serializeArray()를 받아서 반환하는 함수 */ MappingJacksonJsonView를 이용하여 컨트롤에서 @RequestBody로 매핑할 수 있다. 더보기
[jQuery] jQuery Validate jQuery Validate jQuery Validate (링크) jquery validate를 사용하기 위해서는 name값이 반드시 필요. HTML이름 닉네임 이메일 비밀번호 비밀번호 확인 Script$(document).ready(function() {$("#registerform").validate({rules: {nickName: {required: true},userName: {required: true,email: true,remote: {url: "/ajaxValidUser",type: "GET",data: {userName: function() {return $("#userName").val();}}}},userNameAgain: {required: true,email: true,equal.. 더보기
[jQuery] 체크박스 선택 범위 지정 체크박스 선택 범위 지정 html인원수1명2명3명4명5명123456789101112 script 더보기
[jQuery] 페이지 이동전 Form 데이터 변경여부 확인하기 페이지 이동전 Form 데이터 변경여부 확인하기 html teacherstudent script 더보기
[jQuery] form의 모든 input text null check form의 모든 input text null check 회원가입처럼 form의 text field null check시 기존에는 존재하는 모든 필드를 id로 개별적으로 체크를 했었다. 하지만 필드 항목이 늘어나거나 바뀌는 경우에는 스크립트 부분도 같이 수정해야 하는 번거로움이 있어서 필드가 추가, 변경되더라도스크립트는 수정할 필요가 없으면 좋겠다는 생각을 했다. 해당 form의 input 중 모든 text type을 조회하여 null value가 있을 경우 alert과 focus를 주기위해 해당 id, label을 추출하고 true를 반환, null value가 존재하지 않으면 false를 반환하도록 만들어 보았다. txtFieldCheck()가 true가 아닌경우 submit() 기능을 넣어주면 된다... 더보기
[jQuery] jQuery 초기화 jQuery 초기화 //초기화function fn_reset() {if(confirm("초기화 하시겠습니까?")){$('#formID input[type="text"]').val(""); }} // name이 no, sub_no를 제외한 input 초기화$('#formID input[name!="no"][name!="sub_no"]').val(""); 더보기
[jQuery] 스크롤을 따라다니는 팝업 스크롤을 따라다니는 팝업 http://kitchen.net-perspective.com/open-source/scroll-follow/ 더보기