I'm trying to get an implementation of jquery's jqgrid up and running. All is going well, except for the saveCell function I'm tryin to call. What I want my plugin to do is anytime any of the *_fee fields are edited, I want the subtotal and total fields to autoupdate as well. I've got the visual updating working using getCell and setCell, but the saveCell isn't functioning correctly. saveCell() doesn't actually pass the field data to my php script. The initial saving of the edited fee field works perfectly, but subsequent ajax request when the subtotal and total fields are autochanged is not complete. I get the id and the oper fields, but not the field I actually changed!
Here is my code:
$("#cust_grid").jqGrid({
url:'/ajax/grid',
datatype: 'xml',
mtype: 'POST',
colNames:['ID','Company', 'Sales','Credits','Voids','Declines','Total Trans','Monthly Fee','Trans Fee','Misc Fee','Subtotal','Total'],
colModel :[
{name:'id', index:'id', width:55, search: true},
{name:'company', index:'company', width:100, search: true},
{name:'sales', index:'sales', width:70, search: true},
{name:'credits', index:'credits', width:70, search: true},
{name:'voids', index:'voids', width:70, search: true},
{name:'declines', index:'declines', width:70, search: true},
{name:'total_trans', index:'total_trans', width:70, align:'right', search: true},
{name:'monthly_fee', index:'monthly_fee', width:90, align:'right', editable: true, search: true, formatter: 'number'},
{name:'trans_fee', index:'trans_fee', width:70, align:'right', editable: true, search: true, formatter: 'number'},
{name:'misc_fee', index:'misc_fee', width:70, align:'right', editable: true, search: true, formatter: 'number'},
{name:'subtotal', index:'subtotal', width:90, align:'right', search: true},
{name:'total', index:'total', width:90, align:'right', search: true}
],
pager: '#pager',
rowNum:25,
rowList:[10,25,50,100],
sortname: 'id',
sortorder: 'asc',
viewrecords: true,
gridview: true,
caption: 'Our Customers',
height: 600,
altRows: true,
cellEdit: true,
cellsubmit: "remote",
cellurl: "/ajax/editCell",
afterSaveCell: function (rowid, cellname, value, iRow, iCol) {
var transFee = $('#cust_grid').jqGrid('getCell', rowid, 'trans_fee');
var totalTrans = $('#cust_grid').jqGrid('getCell', rowid, 'total_trans');
var subtotal = transFee * totalTrans;
subtotal = subtotal.toFixed(2);
//alert(subtotal);
var monthlyFee = $('#cust_grid').jqGrid('getCell', rowid, 'monthly_fee');
//alert(monthlyFee);
var total = Number(subtotal) + Number(monthlyFee);
开发者_开发百科 //alert(total);
total = total.toFixed(2);
$('#cust_grid').jqGrid('setCell', rowid, 'subtotal', subtotal);
alert("iRow=" + iRow + " iCol=" + iCol);
$('#cust_grid').jqGrid('saveCell', iRow, 10);
alert("cell saved!");
$('#cust_grid').jqGrid('setCell', rowid, 'total', total);
$('#cust_grid').jqGrid('saveCell', iRow, 11);
}
});
$("#cust_grid").jqGrid('navGrid','#pager',
{edit:false,add:false,del:false,search:true},{},{},{},
{
closeAfterSearch:true,
closeOnEscape:true,
},
{}
);
});
The first ajax request contains:
Array
(
[trans_fee] => 15.13
[id] => 1
[oper] => edit
)
But the subsequent ajax request only contains:
Array
(
[id] => 1
[oper] => edit
)
Because the subsequent ajax request don't contain the actual changed field data, I can't save it! Does anyone have tips with this? Thanks!
I think there are misunderstanding what saveCell method do. It works only together with editCell and can't be used just for sending of some cell to the server. After you call [editCell] the current content of the cell will be saved in the internal savedRow parameter. The input field will be created and the user are able to change the cell content. If one later call saveCell method the content of savedRow parameter will be compared with the current cell content. If there are differences then the changes will be sent to the server.
So you try to use saveCell method in a wrong way. You can't send the new cell value which you changed before with respect of setCell
method.
精彩评论