使用jquery启用/禁用asp:validators

Question

我正在使用向导,用户可以在其中注册.有一个asp:RadioButtonList有两个选项,当radiobutton改变时,向导中的一些输入字段会改变.在每个字段上都有一些asp:Validators(例如asp:RequiredFieldValidator).问题是,当用户提交页面时,隐藏文本框的验证器仍然会弹出.

首先,这里是div标签,它改变了显示的文本框和RadioButtonList

<div id="divTxt1">
  <asp:TextBox runat="server" CssClass="text" ID="txtNumber"
       type="number"/>
  <asp:RequiredFieldValidator ID="RequiredFieldValidator1" 
       runat="server" ControlToValidate="txtNumber" EnableClientScript="true" ErrorMessage="Error" ToolTip="Error">*
   </asp:RequiredFieldValidator>
</div>
<div id="divTxt2">
  <asp:TextBox runat="server" CssClass="text" ID="txtNumber2"
       type="number"/>
  <asp:RequiredFieldValidator ID="RequiredFieldValidator2" 
       runat="server" ControlToValidate="txtNumber2" EnableClientScript="true" ErrorMessage="Error2" ToolTip="Error2">*
   </asp:RequiredFieldValidator>
</div>
<div id="radio">
<asp:RadioButtonList ID="RadioButtonList1" runat="server" RepeatDirection="Horizontal">
   <asp:ListItem Value="1" Selected="True">Privat</asp:ListItem>
   <asp:ListItem Value="2">Offentlig</asp:ListItem>
   </asp:RadioButtonList>
</div>

我试图使用类似下面的JQuery来解决它,我已经读过它应该做的伎俩,但不幸的是它没有:

$(document).ready(function () {

    $('#<%= WizardStep1.ContentTemplateContainer.FindControl("RadioButtonList1").ClientID %> input').change(function () {
        if ($(this).val() == "1") {
            $('#txtNumber').toggle('fast');
            $('#txtNumber2').toggle('fast');     
            ValidatorEnable($('#<%=WizardStep1.ContentTemplateContainer.FindControl("RequiredFieldValidator1").ClientID %>')[0], false);
            ValidatorEnable($('#<%=WizardStep1.ContentTemplateContainer.FindControl("RequiredFieldValidator2").ClientID %>')[0], true);
        }

        if ($(this).val() == "2") {
            $('#txtNumber').toggle('fast');
            $('#txtNumber2').toggle('fast');
            ValidatorEnable($('#<%=WizardStep1.ContentTemplateContainer.FindControl("RequiredFieldValidator2").ClientID %>')[0], false);
            ValidatorEnable($('#<%=WizardStep1.ContentTemplateContainer.FindControl("RequiredFieldValidator1").ClientID %>')[0], true);
        }
    });
});

那么,任何想法都有什么不对？

Answer 1

我发现一个更好的选择是简单地使用:

document.getElementById("<%=myValidator.ClientID %>").enabled = true;

上面建议的ValidatorEnabled选项自动调用链接控件的验证,在我的情况下显示错误消息"请输入卖家名称的值",这是不必要或不需要的.

使用".enabled = true"选项不会.

Answer 2

验证程序的客户端API在这里.

您可能能够适应您的需求(这将通过客户端脚本禁用所有验证器):

if (Page_Validators) {
    PageValidators.forEach(function(pageValidator) {
        if (pageValidator == null) {return;}
        vldGrp = pageValidator.validationGroup;
        ValidatorEnable(pageValidator, false);
    });
};

因此,您可以添加一个if块来检查验证器名称,或者更多,以便.controlToValidate返回验证器的目标ID - 然后禁用它:

if (Page_Validators) {
    PageValidators.forEach(function(pageValidator) {
        if (pageValidator == null) {return;}
        if (pageValidator.controltovaliddate != "<%= txtNumber2.ClientID %>") {
            return;
        }
        ValidatorEnable(pageValidator, false);
    });
};

如果你不需要检查任何进一步的验证器,你也应该在循环中添加一个中断,如果它是正确的.您可以使用.some而不是.forEach提前休息:

if (Page_Validators) {
    PageValidators.some(function(pageValidator) {
        if (pageValidator == null) {return false;}
        if (pageValidator.controltovaliddate != "<%= txtNumber2.ClientID %>") {
            return false;
        }
        ValidatorEnable(pageValidator, false);
        return true;
    });
};

您可以将其封装到一个函数中:

var validatorState = function(element, isEnabled) {
    if (Page_Validators) {
        PageValidators.some(function(pageValidator) {
            if (pageValidator == null) {return false;}
            if (pageValidator.controltovaliddate != "<%= txtNumber2.ClientID %>") {
                return false;
            }
            ValidatorEnable(pageValidator, false);
            return true;
        });
    };
};

并使用:

validatorState('txtCancellationReson', true);

要么

validatorState($('#txtCancellationReson').attr('id'), true);