How to check jqgrid checkbox by option outside the grid - jqgrid

Question

I have a jqgrid with a checkbox as a leading column. I need to be able to use an optiongroup outside of the grid to either check All or uncheck All or check Some of the rows
<input id="rblAll" type="radio" name="rblOptStatus" value="All"/>Check All
<input id="rblNone" type="radio" name="rblOptStatus" value="None"/>Uncheck All
<input id="rblSome" type="radio" name="rblOptStatus" value="Some"/>Check 60%
<input id="rblReset" type="radio" name="rblOptStatus" value="Reset" checked="checked" />Reset
So my grid is a loadOnce: true and multiselect is false. The column model is
colModel: [
{ name: 'ab', index: 'ab', width: 50, sortable: true, search: false, align: 'center', editable: true, formatter: 'checkbox', formatoptions: { disabled: false }, edittype: 'checkbox', editoptions: { value: 'True:False' } },
This is the code I was trying to use but the checkbox is not set.
$("input[name=rblOptStatus]").change(function () {
var OptStatus = $("input[name=rblOptStatus]:checked").val()
if (OptStatus == 'All') {
var rows = jQuery("#grdOptionsGrid").getDataIDs();
for (a = 0; a < rows.length; a++) {
var q = jQuery("#grdOptionsGrid").jqGrid('getCell', rows[a], 'ab'); // displays true, for a checked record.
if (q == 'False') {
//MsgBox(q);
//jQuery("#grdOptionsGrid").jqGrid('getCell', rows[a], 'ab').prop('checked', true);
$(this).prop('checked', 'True')
}
}
So how should I be looping through the grid and then checking/unchecking the rows checkbox.
I appreciate your help

Answer 1

You should use getGridRowById to get DOM element of row (<tr>). The method getCell gets the value (the text) and you can't use .prop('checked', true) to check the checkbox. The fixed code could be like
$("input[name=rblOptStatus]").change(function () {
var status = $("input[name=rblOptStatus]:checked").val(),
$grid = $("#grdOptionsGrid"),
ids = $grid.jqGrid("getDataIDs"),
setCheckboxes = function (maxIndex, value) {
var i, $checkbox;
for (i = 0; i < maxIndex; i++) {
$checkbox = $($grid.jqGrid('getGridRowById', ids[i]))
.children('td[aria-describedby="grdOptionsGrid_ab"]')
.find('input');
if ($checkbox.is(":checked") !== value) {
$checkbox.prop('checked', value);
}
}
};
switch (status) {
case 'All':
setCheckboxes(ids.length, true);
break;
case 'None':
setCheckboxes(ids.length, false);
break;
default: //Check 60%
setCheckboxes(ids.length, false);
setCheckboxes(ids.length*0.6, true);
}
});
See https://jsfiddle.net/OlegKi/ef6zp25g/