Hi,
when i tried to add a new row to batch editing grid with a string columns as its primary key, devTools shows me , there will be duplicate entry in both addList and updateList.
when i tried to update a column in exist row , devTools(F12) shows me just working updateList.
when i press the add New Product button and then typing contents in columns and press. After i press Save Changes button
there is {updateList: Array(1), addList: Array(1), deleteList: Array(0), oldList: Array(1)}
when i see both lists, they have same contents
here is insert my code i've used
please help me :p
thank you!
<body>
<div id="grid_editing" style="margin: auto;">
</div>
$(function () {
//called when save changes button is clicked.
function saveChanges() {
var grid = this;
//attempt to save editing cell.
if (grid.saveEditCell() === false) {
return false;
}
if (grid.isDirty() && grid.isValidChange({ focusInvalid: true }).valid) {
var gridChanges = grid.getChanges({ format: 'byVal' });
//post changes to server
console.log(gridChanges);
$.ajax({
dataType: "json",
type: "POST",
async: true,
beforeSend: function (jqXHR, settings) {
grid.showLoading();
},
url: "/pqgrid/batch",
data: {
db_name: "sudo",
list: JSON.stringify(gridChanges)
},
success: function (changes) {
//debugger;
grid.commit({ type: 'add', rows: changes.addList });
grid.commit({ type: 'update', rows: changes.updateList });
grid.commit({ type: 'delete', rows: changes.deleteList });
grid.history({ method: 'reset' });
},
complete: function () {
grid.hideLoading();
}
});
}
}
var obj = {
width:'95%',
height:600,
hwrap: false,
resizable: true,
freezeCols: 2,
rowBorders:false,
trackModel: { on: true }, //to turn on the track changes.
toolbar: {
items: [
{
type: 'button', icon: 'ui-icon-plus', label: 'New', listener: function (){
var rowData = {};
var rowIndx = this.addRow({ rowData: rowData, checkEditable: true});
this.goToPage({ rowIndx: rowIndx });
this.editFirstCellInRow({ rowIndx: rowIndx });
}
},
{ type: 'separator' },
{
type: 'button', icon: 'ui-icon-disk', label: 'Save Changes', cls: 'changes', listener: saveChanges,
options: { disabled: true }
},
{
type: 'button', icon: 'ui-icon-cancel', label: 'Reject Changes', cls: 'changes', listener: function(){
this.rollback();
this.history({ method: 'resetUndo' });
},
options: { disabled: true }
},
{
type: 'button', icon: 'ui-icon-cart', label: 'Get Changes', cls: 'changes', listener: function(){
var changes = this.getChanges({ format: 'byVal' });
if (console && console.log) {
console.log(changes);
}
alert("Please see the log of changes in your browser console.");
},
options: { disabled: true }
},
{ type: 'separator' },
{
type: 'button', icon: 'ui-icon-arrowreturn-1-s', label: 'Undo', cls: 'changes', listener: function(){
this.history({ method: 'undo' });
},
options: { disabled: true }
},
{
type: 'button', icon: 'ui-icon-arrowrefresh-1-s', label: 'Redo', listener: function(){
this.history({ method: 'redo' });
},
options: { disabled: true }
},
........................................
postRenderInterval: -1, //call postRender synchronously.
pageModel: {
format: "#,###",
type: "remote",
rPP: 1000
},
create: function () {
this.widget().pqTooltip();
},
dataModel: {
method:"get",
location: "remote",
recIndx: "app_code",
dataType:"json",
url: "/pqgrid/paging?db_name=sudo",
getData: function(response){
console.log(response.data);
return{curPage: response.curPage, totalRecords:response.totalRecords, data: response.data}
}
}
};