强制 AJAX 验证控件在运行时检查

Question

我有一个 Web 应用程序，它有一个页面，该页面包含一个表单（内置在详细信息视图中）以及一个用户控件。页面上的表单是一个基本表单，有几个要输入的字段和一个复选框。我在 document.ready 上运行了 jQuery，它隐藏了包含用户控件的分区，如果选中了页面表单中的复选框，则会触发 jQuery 以显示用户控件。

两种形式都使用 asp 验证工具进行验证。

如果我填写表单，选中复选框，并在用户控件中填写信息并提交，一切正常，但是如果我填写基本表单并且不选中复选框以显示用户控件，我从用户控件中得到验证错误（因为有一个提交和空值）。我该如何解决这个问题？

代码片段：

 $("#submitMFields").hide();
 $("#submitMFields").toggle(false);
 $("[id$='chkM']").click(function () {
      $("#submitMFields").toggle("slow");
 });

<asp:TemplateField HeaderText="Currency">
                <EditItemTemplate>
                    <asp:DropDownList ID="ddlCurrencyList"
                        runat="server"
                        DataTextField="strCultureName"
                        DataValueField="strCulture"
                        DataSource='<%# CodeLists.Currency() %>'
                        AppendDataBoundItems="true" >
                        </asp:DropDownList>
                </EditItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="Additional Info?">
                <EditItemTemplate>
                    <asp:CheckBox runat="server" ID="chkM" />
                    <div id="submitMFields">
                        <cms:Control runat="server" ID="initialM" />
                    </div>
                </EditItemTemplate>
            </asp:TemplateField>
                <asp:CommandField InsertText="Submit" ShowCancelButton="False" 
                    ShowInsertButton="True" />

在用户控件内部，使用这样的验证 -

<asp:RequiredFieldValidator 
                        id="rfvStartDate" 
                        runat="server" 
                        ControlToValidate="txtStart"
                        ErrorMessage="Start Date is Required" 
                        Display="dynamic">*
                        </asp:RequiredFieldValidator>
                        <ajax:ValidatorCalloutExtender 
                        ID="VCEStart" 
                        runat="server" 
                        TargetControlID = "rfvStartDate" />

Answer 1

你可以在客户端用ClientValidationFunction控制它：

注意：我的例子是使用 jQuery，你可以使用任何你想要的 DOM 选择（document.getElemenyById..etc）

<asp:RequiredFieldValidator 
                    id="rfvStartDate" 
                    ClientValidationFunction="rfvStartDateClientValidate"      
                    ControlToValidate="txtTitle"
                    runat="server" 
                    ControlToValidate="txtStart"
                    ErrorMessage="Start Date is Required" 
                    Display="dynamic">*
                    </asp:RequiredFieldValidator>
                    <ajax:ValidatorCalloutExtender 
                    ID="VCEStart" 
                    runat="server" 
                    TargetControlID = "rfvStartDate" />

function rfvStartDateClientValidate(sender, args) {
    //example below, put your client-side logic here
    //toggling the fields will only hide the validators will still fire
    //disable them based on the checkbox
    var v = $('#<%=txtStart.ClientID%>');
    if (v.val() == '') {
        args.IsValid = false;  // field is empty
        v.addClass('requiredHighlight');
    }
    else {
        v.removeClass('requiredHighlight');
    }
}