如何使RequiredFieldValidator更改父div的css类

Question

我有一个TextBox输入元素,具有RequiredFieldValidator,如下所示:

<div>
    <label>First name</label>
    <asp:RequiredFieldValidator ID="RequiredFieldValidatorFirstname" runat="server" ErrorMessage="Required" ControlToValidate="TextBoxFirstname"></asp:RequiredFieldValidator>
    <asp:TextBox ID="TextBoxFirstname" runat="server"></asp:TextBox>
</div>

当提交时TextBox为空时,我想将类'form-error'添加到父Div:

<div class="form-error">
    <label>First name</label>
    <asp:RequiredFieldValidator ID="RequiredFieldValidatorFirstname" runat="server" ErrorMessage="Required" ControlToValidate="TextBoxFirstname"></asp:RequiredFieldValidator>
    <asp:TextBox ID="TextBoxFirstname" runat="server"></asp:TextBox>
</div>

这是可能的,如果可以的话 - 我该怎么做？

Answer 1

使用以下内容:

<script>

    $(function(){
        if (typeof ValidatorUpdateDisplay != 'undefined') {
            var originalValidatorUpdateDisplay = ValidatorUpdateDisplay;

            ValidatorUpdateDisplay = function (val) {
                if (!val.isvalid) {
                    $("#" + val.controltovalidate).closest("div").addClass("form-error");
                }

                originalValidatorUpdateDisplay(val);
            }
        }
    });

</script>

此代码修饰原始的ValidatorUpdateDisplay函数,该函数负责更新验证器的显示,更新控件以验证最近的div.

Answer 2

使用RequiredFieldValidator,您无法添加自定义代码.

你应该使用asp.net customvalidator控件,并编写自己的自定义验证javascript函数,将类设置为div.