This example demonstartes a setCell and setLabel methods. We can change the contents
and style of the particular header and cell. Again with this we use a loadui option
to disable interaction when the data is loaded
HTML
...
<br/>
<br/>
<table id="method32"></table>
<div id="pmethod32"></div>
<br />
<a href="javascript:void(0)" id="shc">Change the content of header Tax</a>
<br />
<a href="javascript:void(0)" id="scc">Cahnge the tax of row 12</a>
<br />
<a href="javascript:void(0)" id="cdat">Clear the currently loaded data</a>
<br />
<script src="methods32.js" type="text/javascript"> </script>
Java Scrpt code
...
jQuery("#method32").jqGrid({
url:'server.php?q=1',
datatype: "xml",
colNames:['Inv No','Date', 'Client', 'Amount','Tax','Total','Notes'],
colModel:[
{name:'id',index:'id', width:55},
{name:'invdate',index:'invdate', width:90},
{name:'name',index:'name', width:100},
{name:'amount',index:'amount', width:80, align:"right"},
{name:'tax',index:'tax', width:80, align:"right"},
{name:'total',index:'total', width:80,align:"right"},
{name:'note',index:'note', width:150, sortable:false}
],
rowNum:10,
rowList:[10,20,30],
pager: '#pmethod32',
sortname: 'id',
viewrecords: true,
sortorder: "desc",
caption:"setLabel/setCell methods",
multiselect: true,
loadui: "block"
});
jQuery("#method32").jqGrid('navGrid','#pmethod32',{edit:false,add:false,del:false});
jQuery("#shc").click( function() {
$("#method32").jqGrid('setLabel',"tax","Tax Amt",{'font-weight': 'bold','font-style': 'italic'});
});
jQuery("#scc").click( function() {
$("#method32").jqGrid('setCell',"12","tax","",{'font-weight': 'bold',color: 'red','text-align':'center'});
});
jQuery("#cdat").click( function() {
$("#method32").jqGrid('clearGridData');
});