jQuery PlugIn - Validate (유효성 검사)

[Validate.htm]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>회원가입</title>
    <script src="../../js/jquery-1.3.2-vsdoc2.js" type="text/javascript"></script>
    <script src="jquery.validate-vsdoc.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            //$('#myForm').validate(); // 유효성 검사
            $('#myForm').validate({
                rules: {
                    txtID: { required: true, minlength: 3, remote:"Validate.aspx" },
                    txtPassword: { required: true },
                    txtName: { required: true },
                    txtEmail: { email: true },
                    txtPasswordConfirm: { equalTo: "#txtPassword" },
                    txtAge: { range: [1, 150] }
                },
                messages: {
                    txtID: {
                        required: "아이디를 입력하시오.",
                        minlength: jQuery.format("아이디는 {0}자 이상"),
                        remote : jQuery.format("{0}는 이미 있는 아이디")
                    },
                    txtPassword: { required: "암호를 입력하시오." },
                    txtName: { required: "이름을 입력하시오." },
                    txtEmail: { email: "올바른 이메일을 입력하시오." },
                    txtPasswordConfirm: { equalTo: "암호를 다시 확인하세요." },
                    txtAge: { range: "나이는 1~150" }
                },
                // 아래 코드는 버그
                //submitHandler: function () {
                //    $('#myForm').submit(); // 통과시 전송
                //},
                submitHandler: function (frm) {
                    frm.submit(); // 통과시 전송
                },
                success: function (e) {
                    //
                }               
            });
        });
    </script>
</head>
<body>
<form id="myForm" method="post" action="Validate.aspx">
    아이디 : <input type="text" id="txtID" name="txtID" class="required" /><br />
    암호 : <input type="text" id="txtPassword" name="txtPassword" class="required" /><br />
    암호확인 : <input type="text" id="txtPasswordConfirm" name="txtPasswordConfirm" class="required" /><br />
    이름 : <input type="text" id="txtName" name="txtName" class="required" minlength="2" /><br />
    이메일 : <input type="text" id="txtEmail" name="txtEmail" class="required email" /><br />
    나이 : <input type="text" id="txtAge" name="txtAge" /><br />
   
    <input type="submit" value="전송" />
</form>
</body>
</html>

댓글