标准.Net 字段验证器是否可以更改发生错误的文本字段的样式?
如果我有一个需要填写的字段电话号码,如果该字段未填写,它应该在提交时在文本字段周围创建一个红色边框。
希望这可以通过标准控件来完成,所以我不需要使用例如 jQuery Validation 插件等重新编码。
-自由度
标准.Net 字段验证器是否可以更改发生错误的文本字段的样式?
如果我有一个需要填写的字段电话号码,如果该字段未填写,它应该在提交时在文本字段周围创建一个红色边框。
希望这可以通过标准控件来完成,所以我不需要使用例如 jQuery Validation 插件等重新编码。
-自由度
您可以使用 ASP.Net 中的本机组件来执行此操作:
在您的 ASP 页面中:
<asp:TextBox ID="TextBox1" runat="server"/>
<asp:CustomValidator ID="CustomValidator1" runat="server" OnServerValidate="ValidateTextBox1" ForeColor="Red" SetFocusOnError="true"></asp:CustomValidator>
在后面的代码中:
protected void ValidateTextBox1(object source, ServerValidateEventArgs args)
{
if (TextBox1.Text == string.Empty)
{
args.IsValid = false;
TextBox1.Style.Add("border", "solid 1px red");
CustomValidator1.Text = "required";
}
else
args.IsValid = true;
}
PS.:按下按钮时,RequiredFieldValidator 在 CustomValidator 之前被激活。如果同一页面上有任何内容,则必须将其关闭或替换为 CustomValidator。
或者
您可以使用 CSS 和 Javascript。
CSS类:
<style type="text/css">
body
{
font-family:Arial;
font-size:10pt;
}
.ErrorControl
{
background-color: #FBE3E4;
border: solid 1px Red;
}
</style>
JavaScript 函数:
<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);
if (!Page_Validators[i].isvalid) {
control.className = "ErrorControl";
} else {
control.className = "";
}
} catch (e) { }
}
return false;
}
return true;
}
</script>
现在,验证器 ASP.net:
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" ControlToValidate="TextBox1"
runat="server" ErrorMessage="Required"></asp:RequiredFieldValidator>
或者
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
<asp:CustomValidator ID="CustomValidator1" runat="server" ErrorMessage="Required"
ControlToValidate="TextBox2" ValidateEmptyText="true" ClientValidationFunction="Validate"></asp:CustomValidator>
<script type="text/javascript">
function Validate(sender, args) {
if (document.getElementById(sender.controltovalidate).value != "") {
args.IsValid = true;
} else {
args.IsValid = false;
}
}
</script>
您可以使用 ajax 工具包来做到这一点,正如 Lance Zhang在此页面上所解释的那样。