jquery - jqGrid update specific column data with out refreshing the entire column? -
i using jqgrid
in project . want update/refresh specific column data out refreshing entire grid. please give me idea that.
here possible solution. can use 'setcell' in jqgrid set value specific cell in column. see fiddle here: https://jsfiddle.net/99x50s2s/4/
i hope above fiddle give idea complete task.
<table id="sg1"></table> <div id="psg1"></div> <br> <button type="button" id="setcolumnbtn">update 'amount' column</button> jquery("#sg1").jqgrid({ datatype: "local", gridview: true, loadonce: true, shrinktofit: false, autoencode: true, height: 'auto', viewrecords: true, sortorder: "desc", scrollrows: true, loadui: 'disable', colnames:['inv no','date', 'client', 'amount','tax','total','notes'], colmodel:[ {name:'id',index:'id', width:60, sorttype:"int"}, {name:'invdate',index:'invdate', width:90, sorttype:"date"}, {name:'name',index:'name', width:80}, {name:'amount',index:'amount', width:80, align:"right",sorttype:"float"}, {name:'tax',index:'tax', width:80, align:"right",sorttype:"float"}, {name:'total',index:'total', width:80,align:"right",sorttype:"float"}, {name:'note',index:'note', width:150, sortable:false} ], caption: "test grid" }); var mydata = [ {id:"1",invdate:"2007-10-01",name:"test 1234567890123456789",note:"note",amount:"200.00",tax:"10.00",total:"210.00"}, {id:"2",invdate:"2007-10-02",name:"test2",note:"note2",amount:"300.00",tax:"20.00",total:"320.00"} ]; for(var i=0;i<=mydata.length;i++) jquery("#sg1").jqgrid('addrowdata',i+1,mydata[i]); //button event $('#setcolumnbtn').on('click', function(){ var newamount = [111,222]; var existingrowids = jquery("#sg1").jqgrid('getdataids'); $.each(existingrowids, function (j, existingrowid) { jquery("#sg1").jqgrid('setcell', existingrowid, 'amount', newamount[j]); });
});