jQuery Validation Engine 적용해봤어요

jQuery Validation Engine

1) validation js
2) validation 메시지 js 
3) css

를 걸어놓고

<input type="text" ..... class="validate[required,maxSize[40]]"> 과 같은 코딩을 하면
유효성 체크를 해주는 jquery 를 사용한 validation library 다. 

jQuery 사이트에 있는 validation plugin 보다 깔끔한 거 같아서 이 놈을 쓰기로 했다.

메시지 js를 수정해서 한글 메시지로 보이게 할 수 있다.

코드를 다 적용해놓아도 안먹어서 삽질 좀 했다. 혹시 jqgrid 와 쫑나서 그러나 했는데 그건 아니었다.

var jq = jQuery.noConflict();  라는 코드를 없애니 잘 됨.

다른 라이브러리는 쓰지 않고... 요 라이브러리만 두어도 위 코드가 들어가면 먹질 않음...

jqgrid 쓸땐 저 코드가 있어도 $, jq 모두 다 인식되었었는데...
noConflict api 쪽을 보아도 겪은 상황과 연결되어 이해가 안됨.

$(document).ready(function(){

// VALIDATION INIALIZE

    $("#" + formId0 ).validationEngine();

});

이 코드만 해두면 object blur 시에 유효성 메시지를 보여주고, input submit 동작시에도 걸림.
(나는 예전부터 submit 은 안쓰고 일반버튼으로 submit 시킴)

---------------------------------------------------------------------

$('#btnSave').click(function(){

if( fValid(formId0) == false ) return; 

                ............

저장버튼 클릭 이벤트 처리
--------------------------------------------------------------------- 

function fValid(inFormId){

// CUSTOM ---------------------------------------

// BY VALIDATION ENGINE ---------------------------------------

if( $("#" + inFormId).validationEngine('validate') == false )

{

return false;

}

else

{

return true;

}

}

유효성 체크 함수.  혹시 별도로 체크할거 있으면 여기 끼워넣으면 됨.

따로 유효성 체크로직을 만들 경우 validation engine의 js를 수정해도 되지만
가능한 원 라이브러리는 그대로 두기위해 건들지 않음. (예를 들어 libarary 업그레이드를 하는 경우도 있을수 있으니... )

※ jQuery Validation Engine --- URL

http://www.position-absolute.com/articles/jquery-form-validator-because-form-validation-is-a-mess/  

https://github.com/posabsolute/jQuery-Validation-Engine 

Demo : http://www.position-relative.net/creation/formValidator/

※ jQuery 사이트에 있는 validation plugin

http://bassistance.de/jquery-plugins/jquery-plugin-validation/

Demo : http://jquery.bassistance.de/validate/demo/

  * 참고할만한 블로그 글

    http://mytory.co.kr/archives/195 

    http://blog.naver.com/damansa1/120154518795

    jquery.validator 정리