2014-12-30 65 views
0

球員我正在使用javascript來修改包含無效數據的控件的css使用asp.net serverside驗證,但是當我使用Regular Extent驗證它來作爲true和class isnot應用在數據無效時進行控制。當它包含數據時,如果控件是空的,它也不起作用。另外,當我將文本框留空以使用正則表達式或使用正則表達式和必填字段時,文本框邊框顏色保持不變,即它不會更改爲紅色。自定義驗證Page_Validators [i] .isvalid總是成真

我的網頁是這樣的:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="test.aspx.cs" Inherits="test" %> 

<!DOCTYPE html> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 

    <style type="text/css"> 
     body 
     { 
      font-family: Arial; 
      font-size: 10pt; 
     } 
     .ErrorControl 
     { 
      background-color: #FBE3E4; 
      border: solid 1px Red; 
     } 
    </style> 

</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> 
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" ControlToValidate="TextBox1" 
    runat="server" ErrorMessage="Required"></asp:RequiredFieldValidator> 
     <br /> 
     <br /> 
     <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox> 
     <asp:RegularExpressionValidator ID="RegularExpressionValidator1" ValidationExpression ="^[1-9]\d*$" ControlToValidate ="TextBox2" runat="server" ErrorMessage="Invalid data"></asp:RegularExpressionValidator> 

     <br /> 
     <br /> 
     <asp:Button ID="Button1" runat="server" Text="Submit" /> 
    </div> 
    </form> 
     <script type="text/javascript"> 
      function Validate(sender, args) { 
       if (document.getElementById(sender.controltovalidate).value != "") { 
        args.IsValid = true; 
       } else { 
        args.IsValid = false; 
       } 
      } 
     </script> 
<script type="text/javascript"> 
    function WebForm_OnSubmit() { 
     if (typeof (ValidatorOnSubmit) == "function" && ValidatorOnSubmit() == false) { 
      for (var i in Page_Validators) { 
       try { 
        var control = document.getElementById(Page_Validators[i].controltovalidate); 
        alert(i); 
        alert(Page_Validators[i].isvalid); 
        if (!Page_Validators[i].isvalid) { 
         control.className = "ErrorControl"; 
        } else { 
         control.className = ""; 
        } 
       } catch (e) { } 
      } 
      return false; 
     } 
     return true; 
    } 
</script> 

</body> 
</html> 

回答

1

RegularExpressionValidator■不要檢查空字符串 - 他們留給了RequiredFieldValidator

當您有兩個驗證器時,RequiredFieldValidator將設置className="ErrorControl",但然後RegularExpressionValidator將它重置爲className=""。這就是爲什麼它不改變邊框顏色。

解決此問題的還算乾淨和簡單的方式是從表單中刪除所有ErrorControl類你檢查驗證之前,則只是將它加入無效的:

function WebForm_OnSubmit() { 
    if (typeof (ValidatorOnSubmit) == "function" && ValidatorOnSubmit() == false) { 

     // find and remove all .ErrorControl classes 
     var errorControls = document.querySelectorAll('.ErrorControl'); 
     for (var ec = 0; ec < errorControls.length; ec++) { 
      errorControls[ec].className = ""; 
     } 

     for (var i in Page_Validators) { 
      try { 
       var control = document.getElementById(Page_Validators[i].controltovalidate); 
       alert(i); 
       alert(Page_Validators[i].isvalid); 
       if (!Page_Validators[i].isvalid) { 
        control.className = "ErrorControl"; 
       } // no need to remove ErrorControl if valid 
      } catch (e) { } 
     } 
     return false; 
    } 
}