jQuery驗證插件。 回發后驗證不起作用

Question

我已經使用JQuery插件在.Net表單上設置了驗證，所有內容都可以在頁面加載時正常工作，但是在回發驗證之后，該工作就停止了。

然后，如果我清空一個必填字段並嘗試提交，則當我的.Net驗證程序發現問題客戶端時，該字段上的實時驗證將再次開始工作。

這是一個重現此問題的小代碼示例：

<script language="javascript">
    $(document).ready(function () {
        ValidateElements();
    });

    function ValidateElements() {
            jQuery.validator.messages.required = "   ";
            jQuery.validator.messages.email = "   ";

            var rules = {};
            rules[$("#<%=TxtInvoiceName.ClientID%>").attr("name")] = {
                required: true

            };

            $('form').validate({
                rules: rules,
                success: function (label) {
                },
                errorPlacement: function (label) {

                }

            });

            $("#MainForm").validate().form();
        }
</script>

<style>
    input.error {
     border: 1px solid red;
    }
</style>

<form id="MainForm" runat="server">
<div>
    <asp:TextBox runat="server" ID="TxtInvoiceName" Text="" />
                <asp:RequiredFieldValidator ID="RequiredFieldInvoiceName" runat="server" ErrorMessage=""
                    Display="Dynamic" ControlToValidate="TxtInvoiceName"></asp:RequiredFieldValidator>
                <asp:Label runat="server" ID="LblTxtInvoiceNameValidate" AssociatedControlID="TxtInvoiceName">&nbsp;&nbsp;&nbsp;</asp:Label>
                <asp:Button runat="server" Text="PostBack" OnClick="PostBack"  />
</div>
</form>

希望有人可以指出我的錯誤所在。

Answer 1

您只需在頁面上添加一個小腳本即可在回發后替換所有驗證規則

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
function EndRequestHandler(sender, args) {
  ValidateElements();
}

這將為下一次提交表單放回驗證規則。

Answer 2

我已經稍微修改了ValidateElements函數，請嘗試以下操作：

        function ValidateElements() {
                jQuery.validator.messages.required = "   ";
                jQuery.validator.messages.email = "   ";

                var rules = {};
                rules[$("#<%=TxtInvoiceName.ClientID%>").attr("name")] = {
                    required: true

                };

                var $form = $('#MainForm');
                $form.validate({
                    rules: rules,
                    success: function (label) {
                    },
                    errorPlacement: function (label) {

                    }

                });

                // whenever an input element's blur event fires,
                // revalidate the form. do this because the asp.net
                // validators use this behavior
                $form.find(':input').blur(function() {
                    $form.valid();
                });

                  // revalidate the form on submit.
                  // better approach because it requires less form revalidation
                  // on the client side, but it won't be in "synch" with the
                  // asp.net client side validation
//                $('#<%= Button1.ClientID %>').click(function() {
//                    return $form.valid();
//                });
            }