Asp:Net 必填字段将验证组的控件变回红色

Question

如果触发了必填字段，我已经成功地将控件的背面颜色变为红色。但是，我无法让它对组中的控件起作用。

我的每个页面中都有这个 js，就在结束 body 标记之前

function WebForm_OnSubmit() {
 if (typeof (ValidatorOnSubmit) == "function" && ValidatorOnSubmit() ==false) {
  for (var i in Page_Validators) {
    try {
        var control = document.getElementById(Page_Validators[i].controltovalidate);
        if (!Page_Validators[i].isvalid) {
            control.className = "ErrorControl";

        } else {
            control.className = "";
        }
    } catch (e) {
        var r = 0;
    }
}
return false;
}
return true;
}

错误样式的以下 css 类。

.ErrorControl
{
    background-color: #FBE3E4;
    border: solid 1px Red;
}

这是一个验证组中的控件示例

<asp:RequiredFieldValidator runat="server" ID="vldTelephoneNumber" ControlToValidate="txtTelephoneNumber" ValidationGroup="ResellerGroup"></asp:RequiredFieldValidator>

如有任何帮助，我们将不胜感激

Answer 1

这是我用来更改正在验证或单击提交按钮时被视为无效元素的边框和背景颜色的 javascript 函数。它只会将特定验证组的元素变为红色，而不是所有具有验证器的元素。

当验证成功且焦点丢失时，它还会将颜色恢复正常。

<script type="text/javascript">
    $(document).ready(function () {
        if (typeof (Page_Validators) !== 'undefined') {
            //check the elements at a regular interval to change the color back to normal
            setInterval(function () { fieldValidators() }, 100);
        }
    });

    function fieldValidators() {
        if (typeof (Page_Validators) !== 'undefined') {
            for (var i = 0; i < Page_Validators.length; i++) {
                var val = Page_Validators[i];
                var ctrl = document.getElementById(val.controltovalidate);
                if (ctrl != null && ctrl.style != null) {
                    if (!val.isvalid) {
                        $(ctrl).addClass("ErrorControl");
                    } else if ($(ctrl).hasClass("ErrorControl")) {
                        $(ctrl).removeClass("ErrorControl");
                    }
                }
            }
        }
    }
</script>