6
我目前使用afterSaveCell來手動更新網格中的某些單元格。如果用戶使用回車來保存當前編輯的單元格，我的工作正常。jqGrid正在編輯時訪問單元格數據
不幸的是，如果他們點擊或退出單元格，他們直接編輯到另一個單元格中，我不能再獲取新編輯的單元格的單元格值，因爲getCell將僅返回輸入控件的html。
總之，有沒有什麼辦法可以訪問單元格的值，即使它正在被編輯？
jQuery(document).ready(function() {
var mydata = [
{id:"1", 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:"note4", amount:"200.00",tax:"10.00",total:"210.00"},
{id:"5", invdate:"2007-10-05",name:"test5", note:"note5", amount:"300.00",tax:"20.00",total:"320.00"},
{id:"6", invdate:"2007-09-06",name:"test", note:"note6", amount:"400.00",tax:"30.00",total:"430.00"},
{id:"7", invdate:"2007-10-04",name:"test7", note:"note7", amount:"200.00",tax:"10.00",total:"210.00"},
{id:"8", invdate:"2007-10-03",name:"test8", note:"note8", amount:"300.00",tax:"20.00",total:"320.00"},
{id:"9", invdate:"2007-09-01",name:"test", note:"note9", amount:"400.00",tax:"30.00",total:"430.00"},
{id:"10",invdate:"2007-09-08",name:"test10",note:"note10",amount:"500.00",tax:"30.00",total:"530.00"},
{id:"11",invdate:"2007-09-08",name:"test11",note:"note11",amount:"500.00",tax:"30.00",total:"530.00"},
{id:"12",invdate:"",name:"TOTAL", note:"",amount:"",tax:"",total:""}
];
var grid = $("#list");
grid.jqGrid({
cellsubmit: 'remote',
cellurl: '/Example/GridSave',
datatype: "local",
data: mydata,
mtype: 'POST',
colNames: ['Inv No', 'Date', 'Client', 'Amount', 'Tax', 'Total', 'Notes'],
colModel: [
{ name: 'id', index: 'id', width: 65, sorttype: 'int', hidden: true },
{ name: 'invdate', index: 'invdate', width: 120, align: 'center', formatter: 'date', formatoptions: { newformat: 'd-M-Y' }, sortable: false },
{ name: 'name', index: 'name', editable: true, width: 90, sortable: false },
{ name: 'amount', index: 'amount', editable: true, width: 70, formatter: 'number', align: 'right', sortable: false },
{ name: 'tax', index: 'tax', editable: true, width: 60, formatter: 'number', align: 'right', sortable: false },
{ name: 'total', index: 'total', editable: true, width: 60, formatter: 'number', align: 'right', sortable: false },
{ name: 'note', index: 'note', width: 100, sortable: false }
],
rowNum: 1000,
pager: '#pager',
viewrecords: true,
sortorder: "desc",
caption: "afterSaveCell Issue",
height: "100%",
cellEdit: true,
gridComplete: function() {
calculateTotal();
},
afterSaveCell: function (rowid, name, val, iRow, iCol) {
calculateTotal();
}
});
});
function calculateTotal() {
var totalAmount = 0;
var totalTax = 0;
var grid = jQuery("#list");
var ids = grid.jqGrid('getDataIDs');
for (var i = 0; i < ids.length; i++) {
var id = ids[i];
if (grid.jqGrid('getCell', id, 'name') === "TOTAL") {
grid.jqGrid('setRowData', id, {
'amount': totalAmount,
'tax': totalTax,
'total': totalAmount + totalTax
});
}
else {
totalAmount += Number(grid.jqGrid('getCell', id, 'amount'));
totalTax += Number(grid.jqGrid('getCell', id, 'tax'));
}
}
}
在此先感謝！
如果你需要節省TAB當前單元格，你將覆蓋'nextCell'和'prevCell'的默認實現，這將在TAB被稱爲或Shift-TAB。請參閱這裏的函數的代碼：https://github.com/tonytomov/jqGrid/blob/master/js/grid.celledit.js#L305 – Oleg 2011-02-25 20:37:27
謝謝@ Oleg，這肯定會幫助TAB問題，但仍然留下當模糊到同一網格中的另一個單元格時出現問題。 – Shawn 2011-02-25 21:00:21
你是對模糊的。可能將編輯元素綁定到「模糊」甚至「聚焦」事件的方式可以解決您的問題。您可以在'editoptions'中使用'dataEvents'（請參閱http://stackoverflow.com/questions/4407273/jqgrid-retrieve-data-of-cell-and-manipulate-it/4407958#4407958）以綁定到'focusout'事件並調用「saveCell」。您還可以使用'beforeEditCell'來保存'saveCell'中需要的最後一個'iRow'，'iCol'參數。 – Oleg 2011-02-25 22:11:52