jqGrid checkbox events

Question

I have a jqGrid it has a checkbox in the rows. I need to be able to change the value depending of if it is being checked or unchecked. Using this in the $(document).ready block does not work. I have tried multiple solutions that I have found on the forum and nothing seems to work. Any suggestions?

 $('#glReportCodesGrid').children("input:checkbox").click(function () {
    var y = $(this).val();
    if (y == 'false') {
        $(this).val('true');
    }
    else { $(this).val('false'); }
});

Answer 1

You need to use the following selector to find the checkboxes:

jQuery(".jqgrow td input", "#glReportCodesGrid").click(function () {

You would need to call the above from one of the grid events that is triggered after the grid is initialized.

Alternatively, you can use jQuery.delegate to dynamically bind the event handler when the elements are created:

jQuery(document).delegate(
    '#glReportCodesGrid .jqgrow td input', 
    'click', 
    function () { ... });

The question jqgrid-with-an-editable-checkbox-column has some related information that you may find helpful.