顯示列表選中的每個選中的列表框的數量爲

Question

我有一個從數據庫加載項目的asp:CheckBoxList。

我想寫一個腳本，顯示不是。在每張支票上勾選複選框。
我的aspx頁面如下：

<div id="rfd-demo-zone2" class="placeholderContent accordionEmpGroup-child-subGroup-container"> 
    <asp:CheckBoxList ID="ckbList2DesignationUc" runat="Server" RepeatLayout="Flow" RepeatDirection="Horizontal" Width="100%" ></asp:CheckBoxList>   
</div> 

腳本：

<script type="text/javascript"> 
    $('#ckbList2DesignationUc input:checked').each(function() { 
     alert('hi'); 
    }); 
</script> 

在上面的腳本我試圖得到一個警報，但它沒有顯示

Answer 1

認沽腳本在document.ready中，以確保html元素可用於腳本並使用attribute contains selector來查找複選框列表的複選框。

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $('[id*=ckbList2DesignationUc]:checked').each(function() { 
      alert('hi'); 
     }); 
    }); 
</script> 

要在複選框

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $('[id*=ckbList2DesignationUc]').change(function() { 
      alert(this.id); 
     }); 
    }); 
</script> 

Answer 2

可能的解決方法的改變火災事件：

<div id="rfd-demo-zone2" class="placeholderContent accordionEmpGroup-child-subGroup-container"> 
     <asp:CheckBoxList ID="ckbList2DesignationUc" runat="Server" RepeatLayout="Flow" RepeatDirection="Horizontal" Width="100%" > 
     </asp:CheckBoxList>   
</div> 

和訪問：

$("#<%=ckbList2DesignationUc.ClientID %> input[type=checkbox]:checked").each(function() { 
     alert('checked'); 
    }); 

Answer 3

試試下面的代碼：

解決方案-1 只要您選中複選框，一個提醒就會顯示覆選框中選中項目的值。

Javascript代碼：

<腳本類型= 「文本/ JavaScript的」>

  function itemClick(radioButton) { 
      var Control; 
      var selectedItems; 
      selectedItems = ''; 
      Control = document.getElementById("<%=ckbList2DesignationUc.ClientID %>").getElementsByTagName("input"); 
      for (var i = 0; i < Control.length; i++) { 
       if (Control[i].checked == true) 
        selectedItems += i.toString()+','; 
      } 
      alert(selectedItems); 
     } 

</script> 

ASPX代碼：

解決方案：通過使用jQuery

protected void Page_Load(object sender, EventArgs e) 
    { 
     for (int index = 0; index < 10; index++) 
     { 
      ckbList2DesignationUc.Items.Add(new ListItem("Item" + index, index.ToString())); 
     } 
     foreach (ListItem Li in ckbList2DesignationUc.Items) 
     { 
      Li.Attributes.Add("onclick", "return itemClick()"); 
     } 

    } 

必需溶液-2

< script type="text/javascript"> 

    $(document).ready(function() { 
     var selectedCheckBoxes = ''; 
     $('#ckbList2DesignationUc').each(function() { 
      var items = new Array(); 
      $(this).find("input:checkbox").each(function() { 
       $(this).click(function() { 
        selectedCheckBoxes += $(this).val() + ","; 
        alert(selectedCheckBoxes); 
       }); 
      }); 
     }); 

    }); 
< /script> 

< asp:CheckBoxList ID="ckbList2DesignationUc" runat="Server" RepeatLayout="Flow" RepeatDirection="Horizontal" Width="100%"> 
       < /asp:CheckBoxList> 

Answer 4

客戶端：

$('.CheckBoxList').each(function() { 
      var items = new Array(); 
       $(this).find("input:checkbox").each(function() { 
        if ($(this).attr("checked") == true) { 
         items[items.length] = $(this).next().html(); 
        } 
        }); 
        $(this).parent().find('.txtList').val(items.toString()); 
      }); 

HTML標記：

<asp:TextBox runat="server" ID="txtabc" CssClass="txtList txtformatcss" Width="160px" ViewStateMode="Disabled"></asp:TextBox> 
    <asp:CheckBoxList ID="chkabc" runat="server"          
     RepeatLayout="Flow" CssClass="CheckBoxList"> 
</asp:CheckBoxList> 

這裏CheckBoxList是在CheckBoxList控件已給定的類名

Answer 5

這可能幫助你：你可以使用它在代碼後面的文件以及腳本標記enable AutoPostBack property of checkboxlist to true

protected void CheckBoxList1_SelectedIndexChanged(object sender, EventArgs e) 
{ 
    int i=0;    
    foreach (ListItem li in CheckBoxList1.Items) 
    { 
     if (li.Selected) 
      i++; 
    } 
    Response.Write(i);   
}