教你只用一个Validator对多个控件进行验证

本文介绍了一种利用单个验证控件进行多个输入框验证的方法,通过客户端JavaScript实现控件与验证逻辑的动态绑定,有效减少页面体积并提高性能。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

 这个技巧是非常有用。如果我们有多个控件,我们只用一个验证控件来验证它 。这将减少页面大小和改善性能,因为每个验证控件在客户端都会被渲染成span,如果一个页面包含上百个控件,就会使得页面非常的庞大臃肿。

     在这篇文章的Demo中,动态创建的几个textbox,我只使用一个验证控件去验证它们。

 1.aspx页面上:

复制代码
1 <body>
2     <form id="form1" runat="server">
3     <div>
4         <asp:CustomValidator ID="CustomValidator1" runat="server" ></asp:CustomValidator>
5        <asp:ValidationSummary ID="ValidationSummary1" runat="server" />
6     </div>
7 
8     </form>
9 </body>
复制代码

2.在服务端将验证控件和TextBox的onfocus事件关联起来:

复制代码
 1     protected void Page_Load(object sender, EventArgs e)
 2     {
 3         if (!IsPostBack)
 4         {
 5             for (int i = 0; i < 10; i++)
 6             { 
 7                 TextBox tb = new TextBox();
 8                 tb.ID = "tb" + i.ToString();
 9                 tb.Attributes.Add("onfocus""HookUpControl(this,'" + CustomValidator1.ClientID + "')");
10                 Page.Form.Controls.Add(tb);
11             }
12         }
13     }
复制代码

3.HookUpControl函数如下:

复制代码
1        function HookUpControl(curObj, validatorClientID) 
2         {
3             var validationControl = document.getElementById(validatorClientID);
4             validationControl.controltovalidate = curObj.id;
5             validationControl.clientvalidationfunction = "validatetextbox";
6             validationControl.validateemptytext = "true";
7             ValidatorHookupControl(curObj, validationControl);
8         }
复制代码

4.客户端的验证函数如下:

复制代码
 1         function validatetextbox(sender, args) 
 2         {
 3             if (args.Value == ""
 4             {
 5                 sender.errormessage = "<b>该栏位不能为空。";
 6                 sender.innerHTML = "<b>该栏位不能为空。";
 7                 args.IsValid = false;
 8                  return;
 9             }
10             if (isNaN(args.Value)) 
11             {
12                 sender.errormessage = "<b>该栏位只能是数字。";
13                 sender.innerHTML = "<b>该栏位只能是数字。";
14                 args.IsValid = false;
15                  return;
16              }
17              if (Number(args.Value) < 100) {
18                  sender.errormessage = "<b>该栏位的值不能小于100。</b>";
19                  sender.innerHTML = "<b>该栏位的值不能小于100。</b>";
20                  args.IsValid = false;
21                  return;
22              } 
23        }
复制代码

其实主要使用了ValidatorHookupControl(curObj, validationControl)的功能。

 

在第一个TextBox中输入1,提示:该栏位的值不能小于100。

在第二个TextBox中输入a,提示:该栏位只能是数字。

在第三个TextBox输入值,失去焦点后,再删除,提示:该栏位不能为空。。

onfocus事件可以换成你相应的事件,validatetextbox函数也可以扩展等等。




本文转自麒麟博客园博客,原文链接:http://www.cnblogs.com/zhuqil/archive/2010/03/16/Validator.html,如需转载请自行联系原作者

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值