getting value of selected values of checkboxlist in javascript

Question

I have checkBoxList

<asp:CheckBoxList ID="cheBoxTypeOfInc" runat="server" onchange="checkBoxchanged()"  CssClass="form-checkbox" Height="39px" Width="493px" RepeatDirection="Horizontal" RepeatColumns="1">
                 <asp:ListItem Value="CommMotVehiAcci">Commercial Motor Vehicle Accident</asp:ListItem>

                    <asp:ListItem Value="EmpInjry">Employee Injury </asp:ListItem>

                </asp:CheckBoxList>

and I am adding more Item to it as addElement("InciRepo", "Incident Reporting"); and defination of addElement is as below :

 function addElement(a, b) {

        var tableRef = document.getElementById('<%= cheBoxTypeOfInc.ClientID %>');
        var tableRow = tableRef.insertRow();

        var tableCell = tableRow.insertCell();

        var checkBoxRef = document.createElement('input');
        var labelRef = document.createElement('label');

        checkBoxRef.type = 'checkbox';
        checkBoxRef.id = a;

        labelRef.innerHTML = b;
        checkBoxRef.value = a;
        tableCell.appendChild(checkBoxRef);
        tableCell.appendChild(labelRef);

    }

I want to read the selected value using Javascript as

function checkBoxchanged()
    {
        debugger;
        var chebox = document.getElementById('<%= cheBoxTypeOfInc.ClientID %>');
        var checkboxesChecked = [];
        // loop over them all
        for (var i = 0; i < checkboxes.length; i++) {
            // And stick the checked ones onto an array...
            if (checkboxes[i].checked) {
                checkboxesChecked.push(checkboxes[i]);
            }
        }

but its not giving me list. In fact when i am looking for the selected item its not showing checked also. is i am missing something ? is there any other way to active this ? Please advice !!

Your element selector appears to be querying the wrong id. document.getElementById('<%= cheBoxTypeOfInc.ClientID %>') is not a valid element ID to select. I believe the correct one, based on your markup, is: document.getElementById('cheBoxTypeOfInc') — Iskandar Reza
– Iskandar Reza, Commented Aug 30, 2018 at 23:42
Furthermore after selecting the checkbox list, you'd want to iterate through it's children and get the ones with value selected. Here someone has done something like that: stackoverflow.com/a/21133799/5330050 — Iskandar Reza
– Iskandar Reza, Commented Aug 30, 2018 at 23:46

user7776356 · Accepted Answer · 2018-09-20 18:58:47Z

1

this is how i solved it.

            var chebox = document.getElementById('<%= cheBoxTypeOfInc.ClientID %>');
        var options = chebox.getElementsByTagName('input');
        var listOfLabel = chebox.getElementsByTagName('Label');

        for (var i = 0; i < options.length; i++) {
            if (options[i].checked) {
                listOfLabel[i].textContent;
}}

Hope this help !!

answered Sep 20, 2018 at 18:58

user7776356

899 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

gymcode Over a year ago

will var chebox be able to display any value if I were to run console.log after that statement? thanks

Collectives™ on Stack Overflow

getting value of selected values of checkboxlist in javascript

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related