JavaScript 获取服务器端checkBoxlist控件选中的值

通用版本(不依赖任何类库)
function GetCheckBoxListValue(objID)
...{
    var v = new Array();
    var CheckBoxList = document.getElementById(objID);
    if(CheckBoxList.tagName == "TABLE")
    ...{
        for(i=0;i<CheckBoxList.rows.length;i++)    
            for(j=0;j<CheckBoxList.rows[i].cells.length;j++)
  if(CheckBoxList.rows[i].cells[j].childNodes[0])
                    if(CheckBoxList.rows[i].cells[j].childNodes[0].checked==true)
                         v.push(CheckBoxList.rows[i].cells[j].childNodes[1].innerText);
     }
    if(CheckBoxList.tagName == "SPAN")
    ...{
        for(i=0;i<CheckBoxList.childNodes.length;i++)
            if(CheckBoxList.childNodes[i].tagName == "INPUT")
                if(CheckBoxList.childNodes[i].checked==true)
                ...{
                     i++;
                     v.push(CheckBoxList.childNodes[i].innerText);
                 }            
     }
    return v;
}
Asp.net Ajax 版本(依赖 Asp.net Ajax 类库支持)
function GetCheckBoxListValue(objID)
...{
    var v = new Array();
    var CheckBoxList = $get(objID);
    if(CheckBoxList.tagName == "TABLE")
    ...{
        for(i=0;i<CheckBoxList.rows.length;i++)    
            for(j=0;j<CheckBoxList.rows[i].cells.length;j++)
                if(CheckBoxList.rows[i].cells[j].childNodes[0])
                    if(CheckBoxList.rows[i].cells[j].childNodes[0].checked==true)
                          Array.add(v,CheckBoxList.rows[i].cells[j].childNodes[1].innerText);
     }
    if(CheckBoxList.tagName == "SPAN")
    ...{
        for(i=0;i<CheckBoxList.childNodes.length;i++)
            if(CheckBoxList.childNodes[i].tagName == "INPUT")
                if(CheckBoxList.childNodes[i].checked==true)
                ...{
                     i++;
                     Array.add(v,CheckBoxList.childNodes[i].innerText);
                 }            
     }
    return v;
}

三、

CheckboxList是服务器控件,绑定数据容易,用着貌似蛮顺手的。但是生成的静态页面居然没有ListItem的Value值,所以默认情况下在页面中是取不到ListItem的值的。
原始生成页面代码:
<table id="ctl00_mainContent_FriendsList" border="0">
<tr>
   <td><input id="ctl00_mainContent_FriendsList_0" type="checkbox" name="ctl00$mainContent$FriendsList$0" /><label for="ctl00_mainContent_FriendsList_0">jarome</label></td><td><input id="ctl00_mainContent_FriendsList_1" type="checkbox" name="ctl00$mainContent$FriendsList$1" /><label for="ctl00_mainContent_FriendsList_1">admin1</label></td><td></td>
</tr>
</table>
这里面只有Label里面的Text值,显然取不到Value值。
想点办法,自己加个值进来,在数据绑定之后加上下面代码:
      foreach (ListItem li in FriendsList.Items)
            {
                li.Attributes.Add("alt", li.Value);
            }
就是给ListItem加个alt属性,赋予Value值,相当于:

<asp:CheckBoxList ID="FriendsList" runat="server">
            <asp:ListItem Value="jarome" alt="jarome">jarome</asp:ListItem>
            <asp:ListItem Value="admin" alt="admin">admin1</asp:ListItem>
</asp:CheckBoxList>

页面生成代码:

<table id="ctl00_mainContent_FriendsList" border="0">
<tr>
   <td><span alt="jarome"><input id="ctl00_mainContent_FriendsList_0" type="checkbox" name="ctl00$mainContent$FriendsList$0" /><label for="ctl00_mainContent_FriendsList_0">jarome</label></span></td><td><span alt="admin"><input id="ctl00_mainContent_FriendsList_1" type="checkbox" name="ctl00$mainContent$FriendsList$1" /><label for="ctl00_mainContent_FriendsList_1">admin1</label></span></td><td></td>
</tr>
</table>

看到多了个<span/>,alt中就是我们想要取得的值。

//获取CheckBoxList值,使用jQuery类库
function GetCheckBoxListValue(obj) { //obj为CheckBoxList的ClientID
     var v = new Array();
     $("#" + obj+ " input").each(function() {
         if (this.checked) {
             v.push($(this).parent().attr("alt"));
         }
     });
     return v; //返回一列以','分隔的结果
}

转载于:https://www.cnblogs.com/myneng/articles/1691311.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值