asp.net Javascript获取CheckBoxList的value

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


代码如下:

<asp:CheckBoxList runat="server" ID="chkDemo" RepeatDirection="Horizontal" RepeatLayout="Flow"> <asp:ListItem Text="测试A" Value="A"></asp:ListItem>
<asp:ListItem Text="测试B" Value="B"></asp:ListItem>
<asp:ListItem Text="测试C" Value="C"></asp:ListItem>
<asp:ListItem Text="测试D" Value="D"></asp:ListItem>
<asp:ListItem Text="测试E" Value="E"></asp:ListItem>
</asp:CheckBoxList>

当浏览器呈现这段代码后，我们再看看是什么样的Html脚本：
<table id="chkDemo" border="0">
<tr><td><input id="chkDemo_0" type="checkbox" name="chkDemo$0" /><label for="chkDemo_0">测试A</label></td>
<td><input id="chkDemo_1" type="checkbox" name="chkDemo$1" /><label for="chkDemo_1">测试B</label></td>
<td><input id="chkDemo_2" type="checkbox" name="chkDemo$2" /><label for="chkDemo_2">测试C</label></td>
<td><input id="chkDemo_3" type="checkbox" name="chkDemo$3" /><label for="chkDemo_3">测试D</label></td>
<td><input id="chkDemo_4" type="checkbox" name="chkDemo$4" /><label for="chkDemo_4">测试E</label></td> </tr></table>
这段Html脚本会因为RepeatLayout的设置有所差异，但是都有一个共同点，就是 生成的CheckBox没有value属性，
所以在客户端用js是没办法获取值的
为了解决这个问题，我们需要扩展一下CheckBoxList：这是我在CodeProject上找到的源码，时间久了，链接就不贴了吧。


代码如下:

[ToolboxData("<{0}:CheckBoxListEx runat=\"server\"></{0}:CheckBoxListEx>")]
public class CheckBoxListEx : CheckBoxList,IRepeatInfoUser
{
void IRepeatInfoUser.RenderItem(ListItemType itemType, int repeatIndex, RepeatInfo repeatInfo, HtmlTextWriter writer)
{
string clientID = UniqueID + this.ClientIDSeparator + repeatIndex.ToString(NumberFormatInfo.InvariantInfo); //var

writer.WriteBeginTag("input");
writer.WriteAttribute("type", "checkbox");
writer.WriteAttribute("name", UniqueID + this.IdSeparator + repeatIndex.ToString(NumberFormatInfo.InvariantInfo));
writer.WriteAttribute("id", clientID);
writer.WriteAttribute("value", Items[repeatIndex].Value);
if (Items[repeatIndex].Selected)
writer.WriteAttribute("checked", "checked");

System.Web.UI.AttributeCollection attrs = Items[repeatIndex].Attributes;
foreach (string key in attrs.Keys)
{
writer.WriteAttribute(key, attrs[key]);
}
writer.Write("/>");
writer.Write("<label for='" + clientID + "'>");
writer.Write(Items[repeatIndex].Text);
writer.Write("</label>");

}

上边的这段代码是我经过修改的，与原著中有些差别：clientID的生成以及Checked属性的添加等，我想这段代码不需要再详细的讲解了吧。
把它编译成单独的类，在Toolbox上会自动出现，像使用那个正常的CheckBoxList一样，拖动到页面就可以了。
在客户端，我们js取值大致如下：


代码如下:

<script>
function getDemoValue()
{ var els = document.getElementById("chkDemo"); var vals= ''; if (els != null) { var chks = els.getElementsByTagName("input"); for (var k = 0, len = chks.length; k < len; k++) { var chk = chks[k]; if (chk != null && chk.type == 'checkbox' && chk.checked) { vals+= ',' + chk.value; } } }
if(vals.length>1)
vals = vals.substring(1);
return vals;
}
</script>

结束

赞 (0)

相关推荐

  • asp.net(vb.net)获取真实IP的函数

    aspx vb.net获取真实IP的函数如下: 复制代码 代码如下: <script runat="server"> Public Function CheckIp(ByVal ip As String) As Boolean Dim pat As String = "^[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}$" Dim reg As Regex = New Regex(pat) if ip = "

  • Asp.net获取客户端IP常见代码存在的伪造IP问题探讨

    在网卡随便一搜: Asp.net 客户端IP 可以搜索到很多页面,提供的代码基本都类似于: 复制代码 代码如下: if (Request.ServerVariables["HTTP_VIA"] != null) return Request.ServerVariables["HTTP_X_FORWARDED_FOR"].Split(new char[] { ',' })[0]; else return Request.ServerVariables["RE

  • JavaScript asp.net 获取当前超链接中的文本

    <asp:LinkButton ID="BtnBaiyakuNo" runat="server" OnClientClick="openNo(this); return false;" TabIndex="0" /> function openNo(sender) { var linkNo = sender.toString().split("'")[1].replace(/\$/g,"

  • ASP.NET 获取客户端IP方法

    话不多说,请看代码: string requestClientIpAddress = HttpContext.Current.Request.ServerVariables["HTTP_X_FORWARDED_FOR"]; if (string.IsNullOrEmpty(requestClientIpAddress)) requestClientIpAddress = HttpContext.Current.Request.ServerVariables["REMOTE_A

  • ASP.NET实现根据IP获取省市地址的方法

    本文实例讲述了ASP.NET实现根据IP获取省市地址的方法,分享给大家供大家参考.具体实现方法如下: 1.在网站的跟路径下面添加QQWry.dat(点击此处本站下载http://www.jb51.net/softs/10529.html)文件,这个文件是IP数据库文件 2.添加以下一个类 IPScanner 复制代码 代码如下: public class IPScanner {         //私有成员#region 私有成员         private string dataPath;

  • asp.net获取URL和IP地址的方法汇总

    HttpContext.Current.Request.Url.ToString() 并不可靠. 如果当前URL为 http://localhost/search.aspx?user=http://csharp.xdowns.com&tag=%BC%BC%CA%F5 通过HttpContext.Current.Request.Url.ToString()获取到的却是 http://localhost/search.aspxuser=http://csharp.xdowns.com&tag=

  • asp.net获取真实ip的方法

    本文实例讲述了asp.net获取真实ip的方法.分享给大家供大家参考.具体如下: public string getip() { string result = HttpContext.Current.Request.ServerVariables["HTTP_X_FORWARDED_FOR"]; if (null == result || result == String.Empty) { result = HttpContext.Current.Request.ServerVari

  • asp.net 获取IP的相关资料

    ASP.net 获得客户端的IP,最常见的是使用下述代码: 复制代码 代码如下: string user_IP = System.Web.HttpContext.Current.Request.ServerVariables["REMOTE_ADDR"]; 对于了解代理服务器情况的人,我们会知道,如果用户使用了代理服务器,上述代码获得的是代理服务器的IP地址:如果用户使用了多个代理服务器,则是到达服务器的最后一个代理服务器的IP地址. REMOTE_ADDR 说明: 访问客户端的 IP

  • ASP.NET获取真正的客户端IP地址的6种方法

    在ASP中使用 Request.ServerVariables("REMOTE_ADDR") 来取得客户端的IP地址,但如果客户端是使用代理服务器来访问,那取到的就是代理服务器的IP地址,而不是真正的客户端IP地址. 要想透过代理服务器取得客户端的真实IP地址,就要使用 Request.ServerVariables("HTTP_X_FORWARDED_FOR") 来读取. 不过要注意的事,并不是每个代理服务器都能用 Request.ServerVariables(

  • asp.net Javascript获取CheckBoxList的value

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

  • JavaScript获取浏览器信息的方法

    JavaScript获取浏览器信息的方法

    Window有navigator对象让我们得知浏览器的全部信息.我们可以利用一系列的API函数得知浏览器的信息. JavaScript代码如下: function message() { txt = "<p>浏览器代码名: " + navigator.appCodeName + "</p>"; txt+= "<p>浏览器名称: " + navigator.appName + "</p>&q

  • JavaScript获取网页表单提交方式的方法

    本文实例讲述了JavaScript获取网页表单提交方式的方法.分享给大家供大家参考.具体如下: JavaScript获取网页表单的提交方式是get还是post,获取提交方式可以通过表单的method属性获得 <!DOCTYPE html> <html> <body> <form id="frm1" action="form_action.asp" method="get"> First name:

  • javascript获取URL参数与参数值的示例代码

    复制代码 代码如下: <script>                  function goto_url(url){                      var new_url = "http://shop.usteel.com/index.php?app=list_release";                      var d_date  = getParameter("date",url);                    

  • 在asp.net中获取当前页面的URL的方法(推荐)

    获取Url的方法有两种,通过后台获得或通过前面js获得,如下: 1.通过C#获取当前页面的URL string url = Request.Url.AbsoluteUri; //结果: http://www.jb51.net/web/index.aspx string host = Request.Url.Host; //结果:www.jb51.net string rawUrl = Request.RawUrl; //结果:/web/index.aspx string localPath =

  • asp.net异步获取datatable并显示的实现方法

    asp.net异步获取datatable并显示的实现方法

    本文讲述了asp.net异步获取datatable并显示的实现方法.分享给大家供大家参考,具体如下: 上面就是结果,前台代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="MethodOne.aspx.cs" Inherits="_Default" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XH

  • jQuery获取checkboxlist的value值的方法

    CheckboxList是服务器控件,绑定数据容易,服务器端获取选中值也容易.但是生成的静态页面居然没有ListItem的Value值,所以默认情况下用js在页面中是取不到ListItem的值的.至于为什么不显示value值,我也不清楚,本篇给出一个用jQuery获取checkboxlist值的方法. 先看看原始的页面html代码: <asp:CheckBoxList runat="server" ID="listTest"> </asp:Chec

  • JavaScript获取用户所在城市及地理位置

    下面一段代码给大家分享js 获取用户所在城市,具体代码如下所述: <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>获取用户地理位置</title> <script type="text/javascript" src="./jquery-3.3.1.js"&g

  • JavaScript获取文本框内选中文本的方法

    本文实例讲述了JavaScript获取文本框内选中文本的方法.分享给大家供大家参考.具体分析如下: 这里的代码可以用来获取用户通过鼠标在文本输入框或者textarea里选择的选本. 需要注意ie的问题. 代码如下: 复制代码 代码如下: <script type="text/javascript"> function getFieldSelection(select_field) {     word='';     if (document.selection) {   

  • JavaScript获取伪元素(Pseudo-Element)属性的方法技巧

    CSS伪元素(pseudo-elements)非常的有用--你可以用它制作出CSS三角形,用在提示框上面,还可以用它完成很多简单的任务,而不需要多余的HTML元素.以前,伪元素的CSS属性是无法用JavaScript获取的,但现在,有了一个新的JavaScript方法可以访问它们! 假设你的CSS代码是这样的: 复制代码 代码如下: .element:before {  content: 'NEW';  color: rgb(255, 0, 0); } 为了获取.element:before里的

随机推荐