javascript - jquery asp.net checkboxlist get item value - Stack Overflow

admin管理员组

文章数量:1022393

I am trying to get the values from checkboxlist in jquery and depending from which value there is, make the checkbox checked or unchecked. This is what I have:

  <asp:CheckBoxList CssClass="styled" ID="chkTestTypeEdit" RepeatDirection="Horizontal" style="padding:5px;" runat="server">
       <asp:ListItem Value="1" Text="Y/N" />
       <asp:ListItem Value="2" Text="Num" />
  </asp:CheckBoxList>

Then before modal popup is open I have this piece of code:

$(document).on("click", ".open-EditTest", function () {                 
    var optesttype =$(this).data('optesttype');                
    var items = $('#<% = chkTestTypeEdit.ClientID %> input:checkbox');
    for (var i = 0; i < items.length; i++) {

        var val = $('#ctl00_MainContent_chkTestTypeEdit_0').val();
        var val2 = $('label[for=" + <%= chkTestTypeEdit.ClientID %> +_0 "]').text();
        if (items[i].value == optesttype) {
            items[i].checked = true;
            break;
        }
    }
    $('#EditTest').modal('show');
});

So the optesttype will have either 1 or 2, and then I am trying to pare that agains the item[i] value but that value is always 'on'. I tried two methods I found on the net with var val and val2, but nothing gets selected. How do you guys think I need to approach this? Thanks, Laziale

I am trying to get the values from checkboxlist in jquery and depending from which value there is, make the checkbox checked or unchecked. This is what I have:

  <asp:CheckBoxList CssClass="styled" ID="chkTestTypeEdit" RepeatDirection="Horizontal" style="padding:5px;" runat="server">
       <asp:ListItem Value="1" Text="Y/N" />
       <asp:ListItem Value="2" Text="Num" />
  </asp:CheckBoxList>

Then before modal popup is open I have this piece of code:

$(document).on("click", ".open-EditTest", function () {                 
    var optesttype =$(this).data('optesttype');                
    var items = $('#<% = chkTestTypeEdit.ClientID %> input:checkbox');
    for (var i = 0; i < items.length; i++) {

        var val = $('#ctl00_MainContent_chkTestTypeEdit_0').val();
        var val2 = $('label[for=" + <%= chkTestTypeEdit.ClientID %> +_0 "]').text();
        if (items[i].value == optesttype) {
            items[i].checked = true;
            break;
        }
    }
    $('#EditTest').modal('show');
});

So the optesttype will have either 1 or 2, and then I am trying to pare that agains the item[i] value but that value is always 'on'. I tried two methods I found on the net with var val and val2, but nothing gets selected. How do you guys think I need to approach this? Thanks, Laziale

• javascript
• jquery
• html
• asp
• webforms

Share Improve this question Follow asked May 30, 2013 at 16:20 LazialeLaziale 8,2454848 gold badges155155 silver badges271271 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 1

I solved the problem in the following way. My ASP.NET code for the checkboxlist is as below

<asp:CheckBoxList ID="chkHourly" runat="server" RepeatLayout="Table" 
RepeatColumns="4"   RepeatDirection="Horizontal">
 <asp:ListItem Value="0">00:00 AM</asp:ListItem>
 <asp:ListItem Value="1">01:00 AM</asp:ListItem>
 <asp:ListItem Value="2">02:00 AM</asp:ListItem>
</asp:CheckBoxList>  

The generated HTML will look like this below

<table id="ctl00_chkHourly" border="0">
<TBODY>
 <TR>
 <TD>
  <INPUT id=ctl00_chkHourly_0 name=ctl00$chkHourly$0 value="" CHECKED type=checkbox>      
  <LABEL for=ctl00_chkHourly_0>00:00 AM</LABEL></TD>
 <TD>
  <INPUT id=ctl00_chkHourly_1 name=ctl00$chkHourly$1 value="" type=checkbox>
  <LABEL for=ctl00_chkHourly_1>01:00 AM</LABEL></TD>
 <TD>
  <INPUT id=ctl00_chkHourly_2 name=ctl00$chkHourly$2 value="" type=checkbox>
  <LABEL for=ctl00_chkHourly_2>02:00 AM</LABEL>
 </TD>
  </TR>
 </TBODY>

Please notice that there is a label created besides each input in the table, and when a checkbox is checked, the input's value will be 'on' and what you see as an option is the label's text, in my case I needed the text, but to get the value also in a round about away, I would read the name of the individual input fields that are checked. Please see the code below that I have written to read the text selected and also the name of the input selected so that I can strip it and read the value if needed.

var postData = new Array();
$("[id*=chkHourly] input[type=checkbox]:checked").each(function () {
     alert($(this).next().text());
     alert($(this).next().html());
     alert($(this).attr("name"));
     postData.push($(this).next().text());
 });

 if (postData.length > 0) {
  alert("Selected Text(s): " + postData);
 } 
 else {
  alert("No item has been selected.");
 }

Try following:

$("#demo").live("click", function () {
        var selectedValues = "";
        $("[id*=CheckBoxList1] input:checked").each(function () {
            if (selectedValues == "") {
                selectedValues = "Selected Values:\r\n\r\n";
            }
            selectedValues += $(this).val() + "\r\n";
        });
        if (selectedValues != "") {
            alert(selectedValues);
        } else {
            alert("No item has been selected.");
        }
    });

Check following:

ASP.NET CheckBoxList Operations with jQuery

2) sample

I am trying to get the values from checkboxlist in jquery and depending from which value there is, make the checkbox checked or unchecked. This is what I have:

  <asp:CheckBoxList CssClass="styled" ID="chkTestTypeEdit" RepeatDirection="Horizontal" style="padding:5px;" runat="server">
       <asp:ListItem Value="1" Text="Y/N" />
       <asp:ListItem Value="2" Text="Num" />
  </asp:CheckBoxList>

Then before modal popup is open I have this piece of code:

$(document).on("click", ".open-EditTest", function () {                 
    var optesttype =$(this).data('optesttype');                
    var items = $('#<% = chkTestTypeEdit.ClientID %> input:checkbox');
    for (var i = 0; i < items.length; i++) {

        var val = $('#ctl00_MainContent_chkTestTypeEdit_0').val();
        var val2 = $('label[for=" + <%= chkTestTypeEdit.ClientID %> +_0 "]').text();
        if (items[i].value == optesttype) {
            items[i].checked = true;
            break;
        }
    }
    $('#EditTest').modal('show');
});

So the optesttype will have either 1 or 2, and then I am trying to pare that agains the item[i] value but that value is always 'on'. I tried two methods I found on the net with var val and val2, but nothing gets selected. How do you guys think I need to approach this? Thanks, Laziale

I am trying to get the values from checkboxlist in jquery and depending from which value there is, make the checkbox checked or unchecked. This is what I have:

  <asp:CheckBoxList CssClass="styled" ID="chkTestTypeEdit" RepeatDirection="Horizontal" style="padding:5px;" runat="server">
       <asp:ListItem Value="1" Text="Y/N" />
       <asp:ListItem Value="2" Text="Num" />
  </asp:CheckBoxList>

Then before modal popup is open I have this piece of code:

$(document).on("click", ".open-EditTest", function () {                 
    var optesttype =$(this).data('optesttype');                
    var items = $('#<% = chkTestTypeEdit.ClientID %> input:checkbox');
    for (var i = 0; i < items.length; i++) {

        var val = $('#ctl00_MainContent_chkTestTypeEdit_0').val();
        var val2 = $('label[for=" + <%= chkTestTypeEdit.ClientID %> +_0 "]').text();
        if (items[i].value == optesttype) {
            items[i].checked = true;
            break;
        }
    }
    $('#EditTest').modal('show');
});

So the optesttype will have either 1 or 2, and then I am trying to pare that agains the item[i] value but that value is always 'on'. I tried two methods I found on the net with var val and val2, but nothing gets selected. How do you guys think I need to approach this? Thanks, Laziale

• javascript
• jquery
• html
• asp
• webforms

Share Improve this question Follow asked May 30, 2013 at 16:20 LazialeLaziale 8,2454848 gold badges155155 silver badges271271 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 1

I solved the problem in the following way. My ASP.NET code for the checkboxlist is as below

<asp:CheckBoxList ID="chkHourly" runat="server" RepeatLayout="Table" 
RepeatColumns="4"   RepeatDirection="Horizontal">
 <asp:ListItem Value="0">00:00 AM</asp:ListItem>
 <asp:ListItem Value="1">01:00 AM</asp:ListItem>
 <asp:ListItem Value="2">02:00 AM</asp:ListItem>
</asp:CheckBoxList>  

The generated HTML will look like this below

<table id="ctl00_chkHourly" border="0">
<TBODY>
 <TR>
 <TD>
  <INPUT id=ctl00_chkHourly_0 name=ctl00$chkHourly$0 value="" CHECKED type=checkbox>      
  <LABEL for=ctl00_chkHourly_0>00:00 AM</LABEL></TD>
 <TD>
  <INPUT id=ctl00_chkHourly_1 name=ctl00$chkHourly$1 value="" type=checkbox>
  <LABEL for=ctl00_chkHourly_1>01:00 AM</LABEL></TD>
 <TD>
  <INPUT id=ctl00_chkHourly_2 name=ctl00$chkHourly$2 value="" type=checkbox>
  <LABEL for=ctl00_chkHourly_2>02:00 AM</LABEL>
 </TD>
  </TR>
 </TBODY>

Please notice that there is a label created besides each input in the table, and when a checkbox is checked, the input's value will be 'on' and what you see as an option is the label's text, in my case I needed the text, but to get the value also in a round about away, I would read the name of the individual input fields that are checked. Please see the code below that I have written to read the text selected and also the name of the input selected so that I can strip it and read the value if needed.

var postData = new Array();
$("[id*=chkHourly] input[type=checkbox]:checked").each(function () {
     alert($(this).next().text());
     alert($(this).next().html());
     alert($(this).attr("name"));
     postData.push($(this).next().text());
 });

 if (postData.length > 0) {
  alert("Selected Text(s): " + postData);
 } 
 else {
  alert("No item has been selected.");
 }

Try following:

$("#demo").live("click", function () {
        var selectedValues = "";
        $("[id*=CheckBoxList1] input:checked").each(function () {
            if (selectedValues == "") {
                selectedValues = "Selected Values:\r\n\r\n";
            }
            selectedValues += $(this).val() + "\r\n";
        });
        if (selectedValues != "") {
            alert(selectedValues);
        } else {
            alert("No item has been selected.");
        }
    });

Check following:

ASP.NET CheckBoxList Operations with jQuery

2) sample

本文标签： javascriptjquery aspnet checkboxlist get item valueStack Overflow