Jqx Grid Reloading in ajax post json

[Aj_sParticipant]

Hi..community!!
I am new to jqxgrid . First of all thanx jqwidgets for bringing the most flexible grid in jquery.

Here i am successfully binding json data to jqx grid and adding new record to jqx grid. But after i adding it is not getting showing in grid untill i reload the page..I tried using $(“#stateGrid”).jqxGrid(‘updatebounddata’);

My code:
self.AddState = function () {

var args = JSON.stringify({ argBO: jQuery.parseJSON(ko.toJSON(argsToPost)) });

ajax.Post(“AddState.aspx/AddState”, args, false).success(function (data) {
if (data.d[0] > 0) {
$(“#stateGrid”).jqxGrid(‘updatebounddata’);
logger.success(data.d[1]);
}
else {
logger.error(data.d[1]);
}

});
}
IS this the correct way??

[Aj_sParticipant]

My jqxgrid :

var grid = $(“#stateGrid”);
var source = {
datatype: “observablearray”,
datafields: [
{ name: ‘StateId’ },
{ name: ‘CountryName’ },
{ name: ‘StateName’ },
{ name: ‘CountryId’ },
{ name: ‘ShortName’ },
{ name: ‘IsActive’ }
],
localdata: vm.StatesList

};

var dataAdapter = new $.jqx.dataAdapter(source);
var columns = [
{ text: ‘State Id’, dataField: ‘StateId’, width: 25, hidden: true },
{ text: ‘State Name’, dataField: ‘StateName’, width: 200 },
{ text: ‘Short Name’, dataField: ‘ShortName’, width: 100 },
{ text: ‘CountryId’, dataField: ‘CountryId’, width: 75, hidden: true },
{ text: ‘CountryName’, dataField: ‘CountryName’, width: 180 },
{ text: ‘IsActive’, dataField: ‘IsActive’, width: 100 },
{ text: ‘Edit’, datafield: ‘Edit’, columntype: ‘button’, cellsrenderer: function () {
return “Edit”;
}, buttonclick: function (row) {

editrow = row;
var dataRecord = grid.jqxGrid(‘getrowdata’, editrow);
var cm = vm.StateModel;
cm.StateId(dataRecord.StateId);
cm.StateName(dataRecord.StateName);

cm.ShortName(dataRecord.ShortName);

cm.CountryId(dataRecord.CountryId);
}
},
{ text: ‘Remove’, datafield: ‘Remove’, columntype: ‘button’, cellsrenderer: function () {
return “Remove”;
}, buttonclick: function (row) {
editrow = row;
vm.StatesList.splice(editrow, 1);
}
}

];

baseJqx.grid(grid, dataAdapter, columns, 800);

[DimitarParticipant]

Hello Aj_s,

1) Your source uses local data (localdata: vm.StatesList) and yet you post your new record to an external service via Ajax. Are you sure the local variable vm.StatesList is updated accordingly?

2) Is the custom function:

baseJqx.grid(grid, dataAdapter, columns, 800);

what initializes the grid? Please share its code, too.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[Author]

Posts