ASP.NET jQuery 实例15 通过控件CustomValidator验证CheckBoxList

首先看下界面代码：


代码如下:

<form id="form1" runat="server">
<div align="center">
<fieldset style="width: 350px; height: 200px;">
<table border="0" cellpadding="3" cellspacing="3">
<tr>
<td>
请选择汽车类型：
</td>
</tr>
<tr>
<td>
<asp:CheckBoxList ID="chkCar" runat="server">
<asp:ListItem Value="1" Text="奔驰汽车"></asp:ListItem>
<asp:ListItem Value="2" Text="宝马汽车"></asp:ListItem>
<asp:ListItem Value="3" Text="奥迪汽车"></asp:ListItem>
<asp:ListItem Value="4" Text="现代汽车"></asp:ListItem>
<asp:ListItem Value="5" Text="丰田汽车"></asp:ListItem>
</asp:CheckBoxList>
</td>
</tr>
<tr>
<td>
<asp:Button ID="btnSubmit" runat="server" Text="提交" />
</td>
</tr>
</table>
</fieldset>
<asp:CustomValidator ID="ctvCar" runat="server" Display="Dynamic" ErrorMessage="至少选择三种车！"
ForeColor="Red" ClientValidationFunction="ctvCar_Validation"></asp:CustomValidator>
</div>
</form>

控件CustomValidator相关参数说明：
ErrorMessage:设置校验提示信息
Display:设置显示模式，Dynamic表示提示信息不显示的时候，不占用当前位置
ClientValidationFunction:设置定义客户端自定义校验函数
客户端脚本代码：


代码如下:

<head id="Head1" runat="server">
<title>Recipe15</title>
<script type="text/javascript" src="Scripts/jquery-1.4.1-vsdoc.js"></script>
<script type="text/javascript">
function ctvCar_Validation(sender, args) {
// CustomValidator控件通过自定义函数的参数args属性IsValid来判断是否验证通过
args.IsValid = ($("#chkCar input:checked").length >= 3);
}
</script>
</head>

最终显示效果：

赞 (0)

相关推荐

  • fileupload控件 文件类型客户端验证实现代码

    无标题页 function CheckFileType() { var objButton=document.getElementById("Button1");//上传按钮 var objFileUpload=document.getElementById('FileUpload1');//FileUpload var objMSG=document.getElementById('msg');//显示提示信息用的DIV var FileName=new String(objFile

  • jQuery Validate 验证,校验规则写在控件中的具体实例

    将校验规则写到控件中 复制代码 代码如下: <script src="../js/jquery.js" type="text/javascript"></script><script src="../js/jquery.validate.js" type="text/javascript"></script><script src="./js/jquery.met

  • 验证控件与Button的OnClientClick事件详细解析

    一.事件 这是一个长期被我忽略或者是没有发现的问题,问题是这样的: 在一个页面中,当有验证控件的时候,当Button控件触发OnClientClick事件,并且这个事件会返回true和false的时候,验证控件就会失效,不起作用了.具体描述如下: .Net页面如下: 复制代码 代码如下: <form id="form1" runat="server"><asp:ScriptManager ID="ScriptManager1"

  • jQuery密码强度验证控件使用详解

    本文实例为大家分享了jQuery密码强度验证控件,供大家参考,具体内容如下 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <script type="text/javascript" src="jquery-1.12.1.js"></script>

  • 基于jquery实现的服务器验证控件的启用和禁用代码

    基于jquery实现的服务器验证控件的启用和禁用代码

    应用背景 1.用户需要填写表单时.2.页面采用服务器验证控件.3.由用户来选择是否填写更多项,更多项的显示与隐藏用Display控制,如下图. 点击"增加服务内容",显示新增表单项,如下图. 点击"取消增加",隐藏新增表单项. 问题:用户点击下一步时,不对Display=none的新增区域表单进行验证,需要在用户点击"取消增加时",禁用服务器验证控件.反之,启用服务器验证控件. 解决方法 还是使用JQuery来搞定吧,主要是太好用了. 1.输出要

  • ASP.NET jQuery 实例16 通过控件CustomValidator验证RadioButtonList

    ASP.NET jQuery 实例16 通过控件CustomValidator验证RadioButtonList

    界面代码: 复制代码 代码如下: <form id="form1" runat="server"> <div align="center"> <fieldset style="width: 350px; height: 200px;"> <table border="0" cellpadding="3" cellspacing="3&q

  • js控制.net验证控件是否可用。

    function validChange() { // Do nothing if client validation is not active if (typeof (Page_Validators) == "undefined") return; if($("rbBotton_0").checked==false) { ValidatorEnable($('<%=RequiredFieldValidator5.ClientID%>'), false

  • 使用jQuery.Validate进行客户端验证（初级篇） 不使用微软验证控件的理由

    使用jQuery.Validate进行客户端验证（初级篇） 不使用微软验证控件的理由

    主要理由有以下几点: 1.拖控件太麻烦,这个是微软控件的常用方式,你要使用一个控件你得从工具栏中拖到页面里(当然你也可以不拖手写). 2.必须指定验证对象,验证控件与其他textbox,dropdownlist控件不同的是它是验证其他控件的输入是否有效的,所以必须指定所验证的对象. 3.影响整个页面美观,像一些管理系统总是需要进行大量的用户输入验证,所以就可能导致一个页面上有几十个验证控件严重影响了原来页面里的东西,看起来十分不舒服. 4.ajax验证不方便,现在的系统越来越注重客户的用户体验,

  • 教你用AngularJS框架一行JS代码实现控件验证效果

    教你用AngularJS框架一行JS代码实现控件验证效果

    如上图所示,我们需要实现如下这些验证功能: 控件都是必输控件 都需要控制最大长度 第一次打开页面,控件不能显示为错误状态 输入内容再清空后,必输控件需要显示为错误状态 只有所有输入合法后,发布按钮才能变为可用状态 通过AngularJS,我们可以很轻松的实现这些要求,只需要1行JS代码.UI样式这里采用的是Bootstrap.先上示例代码: HTML. <!DOCTYPE html> <html lang="zh-cn" ng-app="ftitApp&qu

  • asp.net MaxLengthValidator 最大长度验证控件代码

    复制代码 代码如下: /// <summary> /// TextBox的最大长度验证器,如果是varchar,char字段类型,需要此验证 /// </summary> [Description("对MaxLength进行验证")] [ToolboxData("<{0}:MaxLengthValidator runat=server></{0}:MaxLengthValidator>")] public class

随机推荐