使用必填字段验证器更改文本框颜色.没有扩展器控制请

我需要在单击"提交"按钮时触发所需的字段验证器时更改TextBox的颜色

1> Dillie-O..：

---

你可以做的是注册一个Javascript函数,它将在提交后遍历全局Page_Validators数组,你可以适当地设置背景.关于这一点的好处是你可以在页面上的所有控件上使用它.该函数如下所示:

function fnOnUpdateValidators()
{
   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.style.background = '#FFAAAA';
         else
            ctrl.style.backgroundColor = '';
      }
   }
}

最后一步是使用OnSubmit事件注册脚本:

VB.NET:

Page.ClientScript.RegisterOnSubmitStatement(Me.GetType, "val", "fnOnUpdateValidators();")

C#:

Page.ClientScript.RegisterOnSubmitStatement(this.GetType(), "val", "fnOnUpdateValidators();");

您将在所有代码中保持正确的IsValid状态,并且它可以与您的所有控件一起使用.

注意:我从以下博客中找到了此解决方案.我只想在源博客发布的情况下将其记录在案.

2> Rory..：

---

您可以非常轻松地覆盖ASP.NET的javascript函数,该函数更新已验证字段的显示.这是一个不错的选项,因为您可以保留现有的字段验证器,而不必编写任何自定义验证逻辑或查找要验证的字段.在下面的例子中,我在具有类'control-group'的父元素中添加/删除'error'类(因为我使用的是twitter bootstrap css):

    /**
    * 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('.control-group').removeClass('error');
        } else {
            // reset invalid controls so they display as valid
            $('#' + val.controltovalidate).closest('.control-group').addClass('error');
        }
    }

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

这是从这里稍微适应的,并从这些 文章中获得有用的信息.

---

这对我需要的东西很有用.谢谢.

3> Alexander Pr..：

---

您可以使用CustomValidator而不是RequiredFieldValidator:

.ASPX

.CS

protected void CustomValidator1_ServerValidate(object source, ServerValidateEventArgs args)
{
    bool is_valid = TextBox1.Text != "";
    TextBox1.BackColor = is_valid ? Color.White : Color.Red;
    args.IsValid = is_valid;
}

客户端和服务器验证函数中的逻辑是相同的,但客户端函数使用jQuery访问文本框值并修改其背景颜色.

---

如果jquery不存在,可以使用`function ValidateTextBox(source,args){var target = document.getElementById("TextBox1"); var is_valid = target.value!=""; if(is_valid){target.style.backgroundColor ="White"; } else {target.style.backgroundColor ="Red"; } args.IsValid = is_valid; }`

4> 小智..：

---

派对很晚,但是为了防止其他人偶然发现并想要一个与Bootstrap一起使用的完整答案,我已经采用了上面的所有示例,并制作了一个版本,该版本可以与多个验证器连接到一个控件上,并将与验证组一起使用: