验证用户必选CheckBox控件与自定义验证javascript代码

CheckBox控件，由于它的值是选择与非选择。因此在提交数据时，想让用户必须选择CheckBox，普通情况之下，不好做验证。

但我们可以使用asp:CustomValidator来验证，不过还得写自定义验证Javascript代码，可参考如下：


代码如下:

function ValidateCheckBox(sender, args) {
var checkbox = document.getElementById("<%=CheckBox1.ClientID %>")
if (checkbox.checked) {
args.IsValid = true;
}
else {
args.IsValid = false;
}
}

代码如下:

<asp:CheckBox ID="CheckBox1" runat="server" />
<asp:CustomValidator ID="CustomValidator1" runat="server" ErrorMessage="必须选择选项" ForeColor="Red" ClientValidationFunction="ValidateCheckBox"></asp:CustomValidator><br />
<asp:Button ID="Button1" runat="server" Text="提交" />

演示：

赞 (0)

相关推荐

  • javascript中checkbox使用方法实例演示

    javascript中checkbox使用方法实例演示

    本文实例讲述了JavaScript实现的伸展收缩型菜单代码.分享给大家供大家参考.具体如下: 运行效果截图如下: (1)全选 (2)部分选 (3)反选(全不选) 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta ht

  • IE7中javascript操作CheckBox的checked=true不打勾的解决方法

    复制代码 代码如下: var chkbox = document.createElement("INPUT"); chkbox.type = "checkbox"; chkbox.checked=true; lnk.parentNode.appendChild(chkbox); 以上代码在IE7下,生成的Checkbox无法正确的打上勾. 原因是 chkbox控件还没初始化(appendChild),就开始操作它的结果 据此将代码改为即可正确显示: 复制代码 代码如

  • 用Javascript读取CheckBox数组的值的代码(兼容IE与firefox)

    document.getElementsByName(name)方法正是用来读取对象数组的.用法如下: var elements = document.getElementsByName("role"); ("role"为CheckBox数组中每个CheckBox共同的名字) for: getElementsByName范例 function test(){ // 得到checkbox数组 var elements = document.getElementsByN

  • javascript基于jQuery的表格悬停变色/恢复,表格点击变色/恢复,点击行选Checkbox

    // 版本: 1.0 // 日期: 2007/08/01 // 备注: 需要jQuery库 // 参考: Dodo(tableRowCheckboxToggle) 和 softcomplex(tigra_tables) function Kin_Tables(                     Kin_Table_GetTableMethod, //得到Table的方法 同$()功能 必选参数                     Kin_Table_Header_Offset, //从

  • Javascript 实现TreeView CheckBox全选效果

    复制代码 代码如下: function OnTreeNodeChecked() { var ele = event.srcElement; if (ele.type == 'checkbox') { var childrenDivID = ele.id.replace('CheckBox', 'Nodes'); var div = document.getElementById(childrenDivID); if (div != null) { var checkBoxs = div.getE

  • asp.net Javascript获取CheckBoxList的value

    以后我会陆续的写出这段时间中学习到的东西,与大家一起分享.这篇文章也算是工作中的一个笔记吧,希望给遇到同样问题的朋友,一点小小的帮助. 在 开发工作中,因为要做用到CheckBoxList在客户端用js操作,无论js怎样调试,就是无法获取value的值,很是郁闷,后来Google了下,去了趟CodeProject,算是幸运的.我们在网页上放置一下代码: 复制代码 代码如下: <asp:CheckBoxList runat="server" ID="chkDemo&quo

  • javascript中checkbox使用方法简单实例演示

    javascript中checkbox使用方法简单实例演示

    演示一个小小的例子:在购物车里面,我们能够勾选自己所选的商品,然后能够显示出相应的价格. 1.首先显示出相应的界面:   相关代码: <body> 商品列表:<br/> 笔记本电脑<input type="checkbox" name="mm" value="3000" onclick="chose(this)" />3000 台式机<input type="checkbox

  • 选择指定数量后checkbox不可选(变灰)javascript代码

    选择3个后可以看到效果 function disableCheckBox() { var obj=document.getElementsByTagName("input") for(var i=0;i 3 ) { event.srcElement.checked=false; break; } } } 粤菜 潮州 客家 川菜 上海/江浙 湖南 湖北 贵州 东北 江西 北京 鲁菜 台湾 新疆/清真 云南 其他中餐 野味 火锅 海鲜 比萨 自助餐 茶餐厅 小吃面食 烧烤 素菜 简餐 快餐

  • javascript获得CheckBoxList选中的数量

    jQuery的选择器真的好强大,好灵活. javascript的原始方法也值得研究. 复制代码 代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="CheckBoxList.aspx.cs" Inherits="CheckBoxList" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1

  • javaScript checkbox 全选/反选及批量删除

    前台代码 复制代码 代码如下: <script type="text/javascript"> var a; function CheckAll(){ if(a==1) { for(var i=0;i<window.document.form1.elements.length;i++) { var e = form1.elements[i]; e.checked =false; } a=0; } else { for(var i=0;i<window.docum

  • Javascript实现CheckBox的全选与取消全选的代码

    Javascript实现CheckBox的全选与取消全选的代码

    本文介绍的方法,触发条件独立,可以全选或取消全选指定 name 的 CheckBox , 同一页面可以有多组供全选的 CheckBox ,功能健全,通用性较强. 效果图:运行查看效果: function checkAll(name) { var el = document.getElementsByTagName('input'); var len = el.length; for(var i=0; i 字母全选开关 a b c d e f g 数字全选开关 1 2 3 [Ctrl+A 全选 注

  • 用 Javascript 验证表单(form)中多选框(checkbox)值

    本文介绍了一个较为通用的获取 checkbox 值的方法,希望对新手有用. 复制代码 代码如下: <script type="text/javascript"> // 说明: 用 Javascript 验证表单(form)中多选框(checkbox)的值 // 作者: CodeBit function getCheckboxValue(checkbox) { if (!checkbox.length && checkbox.type.toLowerCase(

  • 利用JavaScript更改input中radio和checkbox样式

    利用JavaScript更改input中radio和checkbox样式

    本文涉及到的图片 body { margin: 0px; padding: 0px; font-size: 13px; } .input_style { padding: 6px 0px; width: 600px; margin: 0px auto; border-bottom: #666666 1px dotted; } .input_style span { display: inline-block; width: 15px; height: 15px; text-align: left

随机推荐