伙计们，我正在使用 javascript 来修改包含使用 asp.net 服务器端验证的无效数据的控件的 css，但是当我使用常规表达式验证时，它会变为 true，并且当数据无效时，类不会应用于控件。此外，当控件包含数据时，如果控件为空，则它不起作用。此外，当我将使用正则表达式的文本框留空或同时使用正则表达式和必填字段时，文本框边框颜色保持不变，即不会更改为红色。
我的页面是这样的:
<%@ 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>
最佳答案
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;
}
}
关于javascript - 自定义验证 Page_Validators[i].isvalid 始终为 true，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27703211/