首先我们看看.NET 中的验证控件,在页面上做了什么事情。
<asp:TextBox ID="txtValidator" runat="server">asp:TextBox>
<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server"
ControlToValidate="txtValidator"ErrorMessage="RequiredFieldValidator">asp:RequiredFieldValidator>
在页面上解析成:
<input name="txtValidator" type="text" id="Text1" />
<span id="Span1" style="color: Red; visibility: hidden;">RequiredFieldValidatorspan>
验证控件在页面变为了一个隐藏的span,需要验证的时候,进行显示。
同时页面上出现了一些用于验证的脚步
//
//验证控件的集合,当添加一个验证控件的时候,就会多一个item
var Page_Validators = new Array(document.getElementById("RequiredFieldValidator1"));
//]]>
//
var RequiredFieldValidator1 = document.all ? document.all["RequiredFieldValidator1"] : document.getElementById("RequiredFieldValidator1"); //找到验证控件
RequiredFieldValidator1.controltovalidate = "txtValidator";//绑定需要验证的控件
RequiredFieldValidator1.errormessage = "RequiredFieldValidator";//显示未验证通过的错误信息
RequiredFieldValidator1.evaluationfunction = "RequiredFieldValidatorEvaluateIsValid";//用于验证的方法
RequiredFieldValidator1.initialvalue = "";
//]]>
//
var Page_ValidationActive = false;
if (typeof(ValidatorOnLoad) == "function") {
ValidatorOnLoad();
}
function ValidatorOnSubmit() {
if (Page_ValidationActive) {
return ValidatorCommonOnSubmit();
}
else {
return true;
}
}
//]]>
我们通过构造类似的脚本进行控件验证
- 添加验证span
<asp:CheckBox ID="cbSelect" runat="server" Text="选择"onclick="ajusSelectValidator(this,'spantxtUserName')" />
<asp:TextBox ID="txtUserName" runat="server">asp:TextBox>
<span id="spantxtUserName" style="color: Red; display: none;">*该项不能为空span>//添加span,用于显示验证信息
- 添加脚本
<script language="javascript" type="text/javascript">
var IsSelectID = '';
var txtUserName = '';
function ajusSelectValidator (checkbox, validatorID) {
ajustValidator(checkbox, validatorID, txtUserName);
}
script>
//Validator.Js
function ajustValidator(checkbox, validatorID, controltoHideID) {
if (checkbox.checked) {
register(validatorID, controltoHideID);
document.getElementById(controltoHideID).style.visibility = "visible";
}
else {
removeValidator(validatorID);
document.getElementById(controltoHideID).style.visibility = "hidden";
}
}
//添加验证关联
function register(validatorID, controltoValidateId) {
Page_Validators.push(document.getElementById(validatorID));
var span = document.getElementById(validatorID);
spanTest.controltovalidate = controltoValidateId;
span.errormessage = "*该项不能为空";
span.display = "Dynamic";
span.evaluationfunction = "RequiredFieldValidatorEvaluateIsValid";
span.initialvalue = "";
// spanTest.style.visibility = "visible";
ValidatorOnLoad();
}
//取消验证关联
function removeValidator(validatorID) {
var validator = document.getElementById(validatorID);
if (validator) {
for (var i = 0; i < Page_Validators.length; i++) {
if (Page_Validators[i] == validator) {
Page_Validators.splice(i, 1);
i--;
}
}
validator.style.display = "none";
ValidatorOnLoad();
}
}
PS: 如果页面上没有验证控件的话,直接执行上面的代码会出错的,因为Page_Validators 为null,直接往里面push为抛异常。所以用的时候,要加一个验证的控件。
原文地址:http://www.cnblogs.com/stormlly/archive/2009/08/02/1536903.html
来自 “ ITPUB博客 ” ,链接:http://blog.itpub.net/12639172/viewspace-611135/,如需转载,请注明出处,否则将追究法律责任。
转载于:http://blog.itpub.net/12639172/viewspace-611135/