javascript - ASP.NET webforms - 根据 Javascript 中的验证器类型修改控件 CSS

Question

我想在我的 Javascript 代码中区分必填字段验证器和正则表达式验证器，以便我可以根据验证器更改控件的背景颜色。知道我该怎么做吗？
编辑 :这是我要修改的脚本(根据所需的验证器或正则表达式验证器添加条件)

Answer 1

如果您正在使用客户端 jQuery 验证，这是新的 ASP.NET MVC 和 Webforms 项目中的默认设置，那么您已经在 HTML 中拥有所需的属性。

例如，查看 ASP.NET Webforms 中的以下代码:

<div class="col-md-10">
    <asp:TextBox runat="server" ID="TextBox1" CssClass="form-control" TextMode="Email" />

    <asp:RequiredFieldValidator runat="server" ControlToValidate="Email"
    CssClass="text-danger" ErrorMessage="The email field is required." />

    <asp:RegularExpressionValidator runat="server" ControlToValidate="Email"
    CssClass="text-danger" ErrorMessage="The email is not valid" />
</div>

此代码为验证器生成一个文本框输入字段和两个同级 span HTML 元素，并具有相应的 data 属性，用于标识验证器类型、要执行的验证函数等。

所以所需验证器的输出是:

<span data-val-evaluationfunction="RequiredFieldValidatorEvaluateIsValid" data-val-initialvalue=""  data-val="true" data-val-errormessage="The email field is required." data-val-controltovalidate="MainContent_Email"></span>

对于正则表达式验证器，它是:

<span data-val-evaluationfunction="RegularExpressionValidatorEvaluateIsValid" data-val="true" data-val-errormessage="The email field is required." data-val-controltovalidate="MainContent_Email"></span>

为简单起见，我省略了一些输出细节。

因此您可以只使用 ASP.NET 输出的现有数据属性并在您的 javascript 代码中解释它们。

事实上，Page_Validators 数组已经包含该数据。所以你可以这样做:

switch(Page_Validators[i].evaluationfunction.name){
    case "RequiredFieldValidatorEvaluateIsValid": 
        // do stuff for required field validators
        break;
    case "CustomValidatorEvaluateIsValid": 
        // do stuff for custom validators
        break;
    case "RegularExpressionValidatorEvaluateIsValid": 
        // do stuff for regex validators
        break;
    case "CompareValidatorEvaluateIsValid": 
        // do stuff for compare validators          
        break;
}