Thanks.
I created a custom formatter for checkbox column called
checkboxFormatter().
-----------------------------------------------------------------------------------------------------------------------------------------------------------------
<html>
<head>
<title>jqGrid - Custom Formatter</title>
<link rel="stylesheet" type="text/css" href="/themes/coffee/
grid.css" title="coffee" media="screen" />
<script src="/jquery-1.3.2.js" type="text/javascript"></script>
<script src="/jqgrid/jquery.jqGrid.js" type="text/javascript"></
script>
<script src="/jqgrid/js/jqModal.js" type="text/javascript"></
script>
<script src="/jqgrid/js/jqDnR.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery("#list1").jqGrid({
url: '/Data/GridDataNamedColums/',
datatype: 'json',
mtype: 'GET',
jsonReader: {
total: "total", //total pages for the query
page: "page", //current page of the query
records: "records", //total number of records for
the query
root: "rows", //an array that contains the actual
data
repeatitems: false,
id: "other" //the unique id of the row
},
colNames: ['someNumber', 'vote', 'Title', 'other'],
colModel: [
{ name: 'someNumber', width: 40, align:
'left' },
{ name: 'vote', width: 40, align: 'left',
formatter: checkboxFormatter },
{ name: 'Title', width: 400, align: 'left' },
{ name: 'other', width: 40, align: 'left' }, ],
onSelectRow: function(rowid) {
alert('Selected ... rowid=' + rowid);
},
pager: jQuery('#pagerBar'),
rowNum: 10,
//rowList: [2, 5, 10, 20, 50],
viewrecords: true,
height: 250,
imgpath: '/themes/coffee/images',
caption: 'Custom Formatter grid'
});
});
//checkboxFormatter to wire onclick event of checkbox
function checkboxFormatter(el, cval, opts) {
cval = cval + ""; cval = cval.toLowerCase();
var bchk = cval.search(/(false|0|no|off|n)/i) < 0 ? "
checked=\"checked\"" : "";
$(el).html("<input type='checkbox' onclick=\"ajaxSave('" +
opts.rowId + "', this);\" " + bchk + " value='" + cval + "'
offval='no' />");
}
function ajaxSave(rowid, curCheckbox) {
//ajax Save code
}
</script>
</head>
<body>
<h2>List - CUSTOM Formatter </h2>
<table id="list1" class="scroll" cellpadding="0"
cellspacing="0"></table>
<div id="pagerBar" class="scroll" style="text-align:center;"></
div>
</body>
</html>
-----------------------------------------------------------------------------------------------------------------------------------------------------------------
Predefined formatter function, present in jquery.fmatter.js file, are
called from $.unformat and fireFormatter functions.
But I have simply added 'checkboxFormatter' in web page (as shown
above). I have NOT modified jquery.fmatter.js.
Is this correct ?
Thank You.
