JQuery .Net CheckBoxList控件

简介:

很久没弄jQuery了,今天做项目时,遇到个问题:js取不到选中的CheckBoxList的ListItem的值。

 CheckBoxList前台解析为:

<table id="listTest" border="0"> <tr> <td> <input id="listTest_0" type="checkbox" name="listTest$0" /> <label for="listTest_0">item1</label> </td> </tr> <tr> <td><input id="listTest_1" type="checkbox" name="listTest$1" /> <label for="listTest_1">item2</label> </td> </tr> </table>

搜了下,网上有个可行的办法:给ListItem加alt属性(其他属性也行),通过获取属性值来获取选项值;

 

解决方案

在绑定checkboxlist时,为ListItem每个对象添加一个alt属性,值保存对应的value值,代码如下:

 

 if (dt != null && dt.Rows.Count > 0) { foreach (DataRow dr in dt.Rows) { //分别为text值、value值 listTest.Items.Add(new ListItem(dr["Title"].ToString(), dr["ID"].ToString())); } //为ListItem对象添加alt属性,值保存value值 foreach (ListItem li in listTest.Items) { li.Attributes.Add("alt", li.Value); } } <table id="Table1" border="0"> <tr> <td> <span alt="400"><input id="listTest_0" type="checkbox" name="listTest$0" /> <label for="listTest_0">基于jQuery的一个震动效果</label></span> </td> </tr> <tr> <td><span alt="398"><input id="listTest_1" type="checkbox" name="listTest$1" /> <label for="listTest_1">使用css的overflow属性改变缩略图大小</label></span> </td> </tr> </table> 下面就是js取选中的listitem的值: $(document).ready(function() { $("#btnShow").click(function() { var valuelist = ""; //保存checkbox选中值 //遍历name以listTest开头的checkbox $("input[name^='listTest']").each(function() { if (this.checked) { //$(this):当前checkbox对象; //$(this).parent("span"):checkbox父级span对象 valuelist += $(this).parent("span").attr("alt") + ","; } }); if (valuelist.length > 0) { //得到选中的checkbox值序列,结果为400,398 valuelist = valuelist.substring(0, valuelist.length - 1); } }); });

关键点:valuelist += $(this).parent("span").attr("alt") + ",";

目录
相关文章
|
6月前
|
开发框架 JSON JavaScript
ASP.NET Core3.1实战教程---基于Jquery单文件上传
ASP.NET Core3.1实战教程---基于Jquery单文件上传
81 0
|
3月前
|
开发框架 JavaScript 前端开发
震撼!破解 ASP.NET 服务器控件 Button 执行顺序之谜,颠覆你的开发认知!
【8月更文挑战第16天】在ASP.NET开发中,通过Button控件实现先执行JavaScript再触后台处理的需求十分常见。例如,在用户点击按钮前需前端验证或提示,确保操作无误后再传递数据至后台深度处理。此过程可通过设置Button的`OnClientClick`属性调用自定义JavaScript函数完成验证;若验证通过,则继续触发后台事件。此外,结合jQuery也能达到相同效果,利用`__doPostBack`手动触发服务器端事件。这种方式增强了应用的交互性和用户体验。
45 8
|
30天前
|
开发者 Windows
.NET 开源扁平化、美观的 C/S 控件库
【10月更文挑战第23天】介绍了三款适用于 .NET 平台的开源扁平化、美观的 C/S 控件库:MaterialSkin 采用 Google Material Design 风格,适合现代感界面;Krypton Toolkit 提供丰富控件,界面易于定制;Fluent Ribbon Control Suite 模仿 Office 界面,适合复杂功能应用。每款控件库均附有示例代码及 GitHub 链接。
winform .net6 和 framework 的图表控件,为啥项目中不存在chart控件,该如何解决?
本文讨论了在基于.NET 6和.NET Framework的WinForms项目中添加图表控件的不同方法。由于.NET 6的WinForms项目默认不包含Chart控件,可以通过NuGet包管理器安装如ScottPlot等图表插件。而对于基于.NET Framework的WinForms项目,Chart控件是默认存在的,也可以通过NuGet安装额外的图表插件,例如LiveCharts。文中提供了通过NuGet添加图表控件的步骤和截图说明。
winform .net6 和 framework 的图表控件,为啥项目中不存在chart控件,该如何解决?
|
1月前
|
C# Android开发 iOS开发
一组.NET MAUI绘制的开源控件 - AlohaKit
一组.NET MAUI绘制的开源控件 - AlohaKit
|
2月前
|
开发框架 JavaScript 前端开发
|
2月前
|
JavaScript 前端开发 UED
jQuery日历控件与假日显示
【9月更文挑战第1天】
|
4月前
|
移动开发 开发框架 JavaScript
基于Jquery WeUI的微信开发H5页面控件的经验总结(1)
基于Jquery WeUI的微信开发H5页面控件的经验总结(1)
|
4月前
|
移动开发 JSON JavaScript
基于Jquery WeUI的微信开发H5页面控件的经验总结(2)
基于Jquery WeUI的微信开发H5页面控件的经验总结(2)
|
6月前
|
SQL 开发框架 JavaScript
分享33个ASP.NET电子商务源码和40个ASP.NET控件组件源码,总有一款适合您
分享33个ASP.NET电子商务源码和40个ASP.NET控件组件源码,总有一款适合您
85 0