在.net中用CheckBoxList实现单选
更新时间：2014年02月11日 10:33:12 作者：
用CheckBoxList实现单选的原因是我觉得CheckBoxList控件页面展示效果要好看一些,需要的朋友可以参考下
在.net中提供了Radiobuttonlist来实现单选的，但是我一直喜欢用CheckBoxList 原因我觉得CheckBoxList 控件页面展示效果要好看一些，呵呵
这里是先CheckBoxList 实现单选采用了控件的点击事件 调用js来控制单选的
例如页面如下：
<asp:CheckBoxList ID="CheckBoxList1" BorderWidth="1" runat="server" RepeatLayout="Flow">
<asp:ListItem onclick="CheckBoxList_Click(this)" Value="Item1">Item1</asp:ListItem>
<asp:ListItem onclick="CheckBoxList_Click(this)" Value="Item2">Item2</asp:ListItem>
<asp:ListItem onclick="CheckBoxList_Click(this)" Value="Item3">Item3</asp:ListItem>
<asp:ListItem onclick="CheckBoxList_Click(this)" Value="Item4">Item4</asp:ListItem>
<asp:ListItem onclick="CheckBoxList_Click(this)" Value="Item5">Item5</asp:ListItem>
</asp:CheckBoxList>
这里是调用的js
原理就是：
1、获得页面控件集合，循环查找check
2、设置check 为false ，再将传入的控件设置选中
function CheckBoxList_Click(sender)
{
var container = sender.parentNode;
if(container.tagName.toUpperCase() == "TD") { // 服务器控件设置呈现为 table 布局（默认设置），否则使用流布局
container = container.parentNode.parentNode; // 层次： <table><tr><td><input />
}
var chkList = container.getElementsByTagName("input");
var senderState = sender.checked;
for(var i=0; i<chkList.length;i++) {
chkList[i].checked = false;
}
sender.checked = senderState;
}
这里是先CheckBoxList 实现单选采用了控件的点击事件 调用js来控制单选的
例如页面如下：
复制代码 代码如下:
<asp:CheckBoxList ID="CheckBoxList1" BorderWidth="1" runat="server" RepeatLayout="Flow">
<asp:ListItem onclick="CheckBoxList_Click(this)" Value="Item1">Item1</asp:ListItem>
<asp:ListItem onclick="CheckBoxList_Click(this)" Value="Item2">Item2</asp:ListItem>
<asp:ListItem onclick="CheckBoxList_Click(this)" Value="Item3">Item3</asp:ListItem>
<asp:ListItem onclick="CheckBoxList_Click(this)" Value="Item4">Item4</asp:ListItem>
<asp:ListItem onclick="CheckBoxList_Click(this)" Value="Item5">Item5</asp:ListItem>
</asp:CheckBoxList>
这里是调用的js
原理就是：
1、获得页面控件集合，循环查找check
2、设置check 为false ，再将传入的控件设置选中
复制代码 代码如下:
function CheckBoxList_Click(sender)
{
var container = sender.parentNode;
if(container.tagName.toUpperCase() == "TD") { // 服务器控件设置呈现为 table 布局（默认设置），否则使用流布局
container = container.parentNode.parentNode; // 层次： <table><tr><td><input />
}
var chkList = container.getElementsByTagName("input");
var senderState = sender.checked;
for(var i=0; i<chkList.length;i++) {
chkList[i].checked = false;
}
sender.checked = senderState;
}
相关文章
本文是ASP.NET MVC系列的第一篇文章，跟其他学习系列一样，咱们先来点基础知识，之后再循序渐进。我们先从asp.net mvc的概念开始吧。2014-11-11
这篇文章主要给大家介绍了关于如何为ASP.NET Core强类型配置对象添加验证的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2018-12-12
这篇文章主要介绍了asp.net发送邮件实现方法,以一个具体实例的形式详细讲述了asp.net发送邮件的技巧,需要的朋友可以参考下2014-10-10
这篇文章主要介绍了如何在Asp.Net Core中集成Refit，帮助大家更好的理解和学习使用Asp.Net Core，感兴趣的朋友可以了解下2021-03-03
本例完成建立缓存，清除缓存使用缓存进行数据绑定2008-12-12
这篇文章介绍了ASP.NET MVC实现文件下载的方法，文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2022-07-07
.net core 基于Hangfire+Mysql持久化实现定时任务配置方法
这篇文章主要介绍了.net core 基于Hangfire+Mysql持久化实现定时任务配置方法,本文通过图文并茂的形式给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2021-07-07
这篇文章介绍了正确使用dotnet-*工具的方法，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2021-12-12
asp.net中在用ajax格式传递数据到aspx页面时出现乱码
asp.net中在用ajax格式传递数据到aspx页面时有时会出现乱码，很是疑惑，不要走开接下来介绍解决方法，感兴趣的朋友可以了解下2013-01-01
你的站点有被客户投诉很慢吗？是不是查了很多遍还是没有完全解决？是不是数据库没有发现异常，CPU也没有异常，内存占用量没有异常，GC计数没有异常，硬盘IO也没有异常，带宽没有异常，线路没有异常，没有丢包，但就是被投诉？2009-07-07
最新评论