We are using light weight jQuery grid to display Data in a tabular format. But sometimes we need to place some controls(checkbox, button) inside the grid for specific operations.
Consider an example where a column needs to display Checkbox in each row of a Grid.
jQuery Code:
var gridId = jQuery("#jqMyGrid").getDataIDs(); //loop through grid rows for (var countRow = 0; countRow < gridId .length; countRow ++) { var rowId = gridId [countRow ]; //check if Cell has value either 0 or 1(for true/false) if (jQuery("#jqMyGrid").getCell(rowId , "COLUMN4") == 0 || jQuery("#jqMyGrid").getCell(rowId , "COLUMN4") == 1) { //checked control var beChecked = ""; //unchecked control var beNotChecked = ""; //check if control is to be checked or not var inputControl = jQuery("#jqMyGrid").getCell(rowId , "COLUMN4") == 0 ? beNotChecked : beChecked; //set the checkBox jQuery("#jqMyGrid").jqGrid('setRowData', rowId , { 'COLUMN4': inputControl }); } }
More over if you want user defined functions to be called on click of the checkboxes, you can add functions in the control definition.
var beChecked = "