使用jQuery验证表单的问题?

时间:2014-03-26 19:46:35

标签: jquery asp.net-mvc-4 jquery-validate

我需要使用jQuery验证寄存器表单。我尝试使用jQuery验证方法,但我没有得到输出。

任何人都可以帮到我错的地方吗?

我包括我所做的:

    <script src="../../Scripts/jquery-1.9.0.min.js" type="text/javascript "> 
    </script>
    <script src="../../Scripts/jquery.validate.js" type="text/javascript"></script>
    <script src="../../Scripts/jquery.validate.min.js" type="text/javascript"> 
    </script>
    <script type="text/javascript">
                $(document).ready(function () {

                   $("#form1").validate({
                     rules: {
                    txtfirstname: "required", // simple rule, converted to {required:true} 
                    txtlastname: "required",
                    txtusername: "required",
                    txtpassword: "required",
                    txtemail: {// compound rule 
                        required: true,
                        email: true
                    },
                    txtaddress: "required",
                    txtstate: "required",
                    txtcity: "required",
                    txtzip: "required"
                },
                messages: {
                    txtzip: "Please enter a comment."
                }
              });
            });       

</script>
<form action="" method="post" id="form1">
   <div>
        <table>
            <tr>
                <td>
                    <label>
                        Firstname</label>
                </td>
                <td>
                    <input type="text" id="txtfirstname" name="txtfirstname" />
                </td>
            </tr>
            <tr>
                <td>
                    <label>
                        Lastname</label>
                </td>
                <td>
                    <input type="text" id="txtlastname" name="txtlastname" />
                </td>
            </tr>
            <tr>
                <td>
                    <label>
                        Username</label>
                </td>
                <td>
                    <input type="text" id="txtusername" name="txtusername" />
                </td>
            </tr>
            <tr>
                <td>
                    <label>
                        Password</label>
                </td>
                <td>
                    <input type="text" id="txtpassword" name="txtpassword" />
                </td>
            </tr>
            <tr>
                <td>
                    <label>
                        Email</label>
                </td>
                <td>
                    <input type="text" id="txtemail" name="txtemail" />
                </td>
            </tr>
            <tr>
                <td>
                    <label>
                        Address</label>
                </td>
                <td>
                    <input type="text" id="txtaddress" name="txtaddress" />
                </td>
            </tr>
            <tr>
                <td>
                    <label>
                        State</label>
                </td>
                <td>
                    <input type="text" id="txtstate" name="txtstate" />
                </td>
            </tr>
            <tr>
                <td>
                    <label>
                        City</label>
                </td>
                <td>
                    <input type="text" id="txtcity" name="txtcity" />
                </td>
            </tr>
            <tr>
                <td>
                    <label>
                        Zip</label>
                </td>
                <td>
                    <input type="text" id="txtzip" name="txtzip" />
                </td>
            </tr>
            <tr>
                <td>
                    <input type="button" id="btnclick" value="SUBMIT" />
                </td>
            </tr>
           </table>
      </div>
</form>

1 个答案:

答案 0 :(得分:3)

单击按钮时,您的按钮不会触发表单提交 - 因此不会进行验证

变化

<input type="button" id="btnclick" value="SUBMIT" />

<input type="submit" id="btnclick" value="SUBMIT" />

FIDDLE