Kar
Kar

Reputation: 321

Get checkbox state in array with javascript or jquery

I have on a devexpress grid one column with a checkbox. It is a simple checkbox column, which depends on which checkbox is checked I need to invoke different methods, it is not bind to a property from model.

enter image description here

I need to know which row is selected. I have tried to resolve this with this javascript code:

if (document.getElementById('selectDamage').checked) {
        alert("checked");
        var checkedValues = $('input:checkbox:checked').map(function () {
            return this.value;
        }).get();
        console.log(checkedValues);
        } else {
            alert("You didn't check it! Let me check it for you.");
        }

This returns only the checked values. I need to return something like Array{on, off, on}, the first is checked, the second one is unchecked and the last is checked. Is there a way in javascript or jquery to do that?

Upvotes: 0

Views: 466

Answers (2)

Sumit k
Sumit k

Reputation: 75

first add checkbox in grid then take a button and set onclick function of this button , then all checked data will go through array and finally split the array value and do your further job.(array value are saved into hidden field, i used hidden field and set the id lblarr )

                      <dx:GridViewDataColumn >
                            <HeaderTemplate>

                            </HeaderTemplate>
                            <DataItemTemplate>                                   

                                <input type="checkbox" class="case" id="chkchild" name="checkboxModel" value='<%#Eval("SALE_DOC_#") %>' />
                            </DataItemTemplate>
                        </dx:GridViewDataColumn>


<script>
                  $('#btn1').click(function () {
                 var CheckCount =$('input:checkbox[name="checkboxModel"]:checked').length;
                 if (CheckCount > 0) 
                  {
               var valuesArray = 
        $('input:checkbox[name="checkboxModel"]:checked').map(function () {

                        return this.value;

                    }).get().join(","); 

                    $('#<%=lblarr.ClientID%>').val(valuesArray);                       

                }              
                else {

                    alert('Please check at least one data!')

                }
            })

</script>

Upvotes: 3

Napoli
Napoli

Reputation: 1403

Depending on the layout of your html, you could do something like this to get an updated array of indexed checked states

var els = $("table#gvDamages3_DXMainTable input[type=checkbox]");
els.on("change", function(){
    var vals = [];
    els.each(function() {
        vals.push(this.checked);
    });

    console.log(vals);
});

Upvotes: 1

Related Questions