http://blog.naver.com/choiye84/130130406299
jquery validation check plugin 을 발견햇다!.
쓰기 편한것 같고 깔끔한것 같다.
validation말고도
Accordion, Autocomplete, Message, Password Validation 등등이 있다.
쓰기 편하게 되어져 있는것 같고, 한가지 아쉬운 점은 아이디 같은 경우는 ajax로 호출해서 사용유무를 가져왔으면 하는데.. 그 기능이 없는것 같다? 웅?
-,.-
사이트 url은 http://bassistance.de/jquery-plugins/ 이고,
여기 validation에 대해서 자세히? 소개한 어느 블러거님의 url도 같이 ! 투척! http://mytory.co.kr/archives/195
웅웅? jquery 진짜 짱인것 같다. 후후
다른 validation 좀 찾아봐야지~
==================================추가=================================
validation API
http://docs.jquery.com/Plugins/Validation
여기서 보면 remote option도 있어서 ajax로 할 수도 있다!
이번에 찾은 좋은 jquery validation을 찾아서 공유 합니다.ㅎ
먼저 http://bassistance.de/jquery-plugins/jquery-plugin-validation/ 요기서 다운 받으시면 되구요.
API 는 http://docs.jquery.com/Plugins/Validation 여기에 있습니다.
그럼 간단한 설명 하겠습니다.
jquery.validate 를 다운 받습니다.
그리고 자바스크립트 선언을 해줍니다.
html 코딩
아이디
이름
비밀번호
비밀번호 확인
여기서 주의 할 점은 꼭 태그를 추가 해줘야 한다는 것입니다.
js코딩
$("#managerForm").validate({
rules:{
id:{
required:true
,remote:"/remote/getChkUserId.do"
}
,nm:"required"
,pw:{
required:true
,minlength:6
,maxlength:12
}
,pwchk:{
equalTo:"#pw"
}
,email:{
required:true
,email:true
}
}
,messages:{
id:"입력해주세요."
,nm:"입력해주세요."
,pw:{
required:"입력해주세요."
,minlength:"6자 이상"
,maxlength:"12자 이하"
}
,pwchk:{
equalTo:"일치하지 않습니다."
}
,email:"입력해주세요."
}
});
validate에는 2개의 오브젝트가 있는데요.
rules와 message 입니다.
rules가 validate 체크 해주는 오브젝트고, message는 유효하지 않을 시 표현하는 메세지입니다.
그리고 remote 옵션을 이용하면 ajax로 아이디값 실시간으로 가져 올 수 도 있습니다.
더 자세한 사항은 위에 나와있는 api url에 가시면 더 자세하고 정확하게?! 확인 하 실 수 있습니다.
css 코딩
input.error, textarea.error{
border:1px dashed red;
}
label.error{
margin-left:10px;
color:red;
}
input.error, textarea.error{
border:1px dashed red;
}
label.error{
padding-left:5px;
display:inline;
color:red;
}
display:inline; 을 block; 으로 바꿔주면 input 태그 밑에 메세지가 표현됩니다^^
이렇게 코딩 해주고 submit 해주면 아래와 같이 나옵니다.
[출처] [jQuery] validation|작성자 빼빼로
