jquery - ASP 验证的样式 - RequiredFieldValidator 和 RegularExpressionValidator

Question

我正在努力处理 ASP 表单，为了从一开始就说清楚，我是 ASP.Net 的新手。

问题是当输入标签填写错误时，我想设置样式。我使用了这段代码:https://stackoverflow.com/a/11954218/3840831对我来说是这样的:

/**
* Re-assigns the ASP.NET validation JS function to
* provide a more flexible approach
*/
    function UpgradeASPNETValidation() {
        if (typeof (Page_ClientValidate) != "undefined") {
            AspValidatorUpdateDisplay = ValidatorUpdateDisplay;
            ValidatorUpdateDisplay = NicerValidatorUpdateDisplay;
        }
    }

    /**
    * This function is called once for each Field Validator, passing in the 
    * Field Validator span, which has helpful properties 'isvalid' (bool) and
    * 'controltovalidate' (string = id of the input field to validate).
    */
    function NicerValidatorUpdateDisplay(val) {
        // Do the default asp.net display of validation errors (remove if you want)
        AspValidatorUpdateDisplay(val);

        // Add our custom display of validation errors
        if (val.isvalid) {
            // do whatever you want for invalid controls
            $('#' + val.controltovalidate).closest('.form-group').removeClass('has-error has-feedback');
        } else if(!val.isvalid) {
            // reset invalid controls so they display as valid
            $('#' + val.controltovalidate).closest('.form-group').addClass('has-error has-feedback');
        }
    }

    // Call UpgradeASPNETValidation after the page has loaded so that it 
    // runs after the standard ASP.NET scripts.
    $(document).ready(UpgradeASPNETValidation);

它运行良好，但是......在我的一些输入中，我同时拥有“RequiredFieldValidator”和“RegularExpressionValidator”，如下所示:

<div class="form-group">
        <label class="col-sm-4 control-label">
            Telefon (8 cifre, uden mellemrum)
        </label>
        <div class="col-sm-8">
            <asp:TextBox ID="TxtPhone" CssClass="form-control" runat="server"></asp:TextBox>
            <asp:RegularExpressionValidator ID="RegularExpressionValidator3" runat="server" ErrorMessage="Ugyldigt telefon-format" Text="*" ControlToValidate="TxtPhone" SetFocusOnError="true" ValidationExpression="^(\d\d\d\d\d\d\d\d)$"><span class="glyphicon glyphicon-remove form-control-feedback"></span></asp:RegularExpressionValidator>
            <asp:RequiredFieldValidator ID="RequiredFieldValidator6" runat="server" ErrorMessage="Udfyld venligst telefon" Text="*" ControlToValidate="TxtPhone"><span class="glyphicon glyphicon-remove form-control-feedback"></span></asp:RequiredFieldValidator>
        </div>
    </div>

当 JQuery 必须弄清楚是“RegularExpressionValidator”还是“RequiredFieldValidator”为假时，问题就出现了。如果我遗漏了任何信息，请立即联系我。

Answer 1

我找到了一个看起来像这样的解决方案:

/**
* Re-assigns the ASP.NET validation JS function to
* provide a more flexible approach
*/
function UpgradeASPNETValidation() {
    if (typeof (Page_ClientValidate) != "undefined") {
        AspValidatorUpdateDisplay = ValidatorUpdateDisplay;
        ValidatorUpdateDisplay = NicerValidatorUpdateDisplay;
    }
};

/**
* This function is called once for each Field Validator, passing in the 
* Field Validator span, which has helpful properties 'isvalid' (bool) and
* 'controltovalidate' (string = id of the input field to validate).
*/
function NicerValidatorUpdateDisplay(val) {
    // Do the default asp.net display of validation errors (remove if you want)
    AspValidatorUpdateDisplay(val);

    $('.form-group').each(function () {
        var errors = $(this).find('.error:not(:hidden)').length;
        if (errors > 0) {
            $(this).addClass('has-error has-feedback');
        } else {
            $(this).removeClass('has-error has-feedback');
        }
    });
};


// Call UpgradeASPNETValidation after the page has loaded so that it 
// runs after the standard ASP.NET scripts.
$(document).ready(UpgradeASPNETValidation);