如何限制服务器端验证直到完成客户端验证jquery ajax

时间:2012-02-14 06:58:42

标签: jquery ajax

我正在使用ajax请求进行服务器端验证,同时我使用jquery验证使用客户端验证,但我同时获得两个验证,我想限制服务器端验证,直到客户端验证完成

我的jquery代码

$(document).ready(function(){
    $("#userForm").validate({
        rules: {
           firstName: "required",
           lastName: "required",
        },
        messages: {
            firstName: "FirstName is required",
            lastName: "LastName is required",
        },
        errorPlacement: function(error, element) {
            // error.insertAfter("#some");
            error.insertAfter(element.siblings("span"));
        }
    });
    $("#submit").click(function(){
    $("form").valid();
});

});
function validateAddUser(){
    $.ajax({
           type: "POST",
           url: "validateAddNewUser.php",                  
           data: $("#userForm").serialize(),
           success: function(msg){
               if(msg)
               {
                   $('#messageConatiner').html(msg);
               }
               else
               {
                   $('#messageConatiner').html(msg);
               }
           }   
     });
}

HTML代码

<div id="messageConatiner"></div>
<div id="formtb">
<form action="validateAddNewUser.php" method="POST" id="userForm">
<table width="100%" border="0" cellspacing="6" cellpadding="1"
    class="tabcont">
    <tr>
        <td width="47%" align="right">
            *First Name:
        </td>
        <td width="53%">
            <input type="text" id="firstname" name="firstName"/>
            <br />
            <span></span>
        </td>
    </tr>

    <tr>
        <td align="right">
            * Last Name:
        </td>
        <td>
            <input type="text" id="lastname" name="lastName"/>
            <br />
            <span></span>
        </td>
    </tr>
    <tr>
        <td align="right" colspan="2">
            <input name="addNewUser" type="button" class="submit" id="submit" value="Submit" onclick="validateAddUser();" />
        </td>
    </tr>
</table>
</form>
</div>

4 个答案:

答案 0 :(得分:0)

您需要在以下位置调用validateAddUser()功能:(并将其从onclick中删除)

$.validator.setDefaults({
    submitHandler: function() { 
        validateAddUser();
    }
});

答案 1 :(得分:0)

return false;
在span标记中插入错误消息后,在errorPlacement中

。这样,如果验证在客户端没有错误,则会停止click事件的默认行为。

答案 2 :(得分:0)

使用此

if($("form").valid()){    $("#submit").click();}

答案 3 :(得分:0)

你应该这样试试:

$(function () {
$(form).validate(); $(form).submit(function () {" enter code here" }); });