var lastsel; jQuery("#list4").jqGrid({ datatype: "local", height: 250, 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:200, editable:true, edittype: "select", editoptions: { value: testvalue(),dataEvents: [ { type: 'change', data: { cell: 'name' }, fn: test } ] }, editrules: { required: true } }, {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} ], onSelectRow: function(id){ if(id && id !== lastsel) { jQuery('#list4').jqGrid('restoreRow',lastsel); jQuery('#list4').jqGrid('editRow',id,true); lastsel = id; } }, multiselect: true, caption: "Manipulating Array Data" }); function test(e) { console.log(e.data['cell']); var inputValue = jQuery('#' + lastsel + '_' + e.data['cell']).val(); // form input value mydata[lastsel-1]['name'] = inputValue; jQuery("#list4").setRowData(lastsel, {name: 'changed!'}); jQuery("#list4").setCell(lastsel, e.data['cell'], 'changed!'); } function testvalue() { return "1:one;2:two;3:three;4:four!!!"; } var mydata = [ {id:"123",invdate:"2007-10-01",name:"test",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"}, {id:"3",invdate:"2007-09-01",name:"test3",note:"note3",amount:"400.00",tax:"30.00",total:"430.00"}, {id:"4",invdate:"2007-10-04",name:"test",note:"note",amount:"200.00",tax:"10.00",total:"210.00"}, {id:"5",invdate:"2007-10-05",name:"test2",note:"note2",amount:"300.00",tax:"20.00",total:"320.00"}, {id:"6",invdate:"2007-09-06",name:"test3",note:"note3",amount:"400.00",tax:"30.00",total:"430.00"}, {id:"7",invdate:"2007-10-04",name:"test",note:"note",amount:"200.00",tax:"10.00",total:"210.00"}, {id:"8",invdate:"2007-10-03",name:"test2",note:"note2",amount:"300.00",tax:"20.00",total:"320.00"}, {id:"9",invdate:"2007-09-01",name:"test3",note:"note3",amount:"400.00",tax:"30.00",total:"430.00"} ]; for(var i=0;i<=mydata.length;i++) { jQuery("#list4").jqGrid('addRowData',i+1,mydata); } });
I'm attempting to write something that will submit changed rows in batch.