View Full Version : Pushing changed grid data back to server for Insert/Update

30 May 2007, 12:58 PM
Would someone please point me to an example of tutorial that explains the best way to send data that has changed with an inline editor ext.grid back to the server via JSON? I'm using PHP on the server and MySQL.

Do I use commit Changes? or do i use the Stale property?

30 May 2007, 1:19 PM
For sure there are a few ways, here is mine:

var mr = grid.getDataSource().getModifiedRecords();
var data = new Array;
for (var index in mr) {
var conn = new Ext.data.Connection();
conn.request({method: 'POST', url: 'index.php', params: { action: 'update', data: Ext.util.JSON.encode(data) } });
conn.on('requestcomplete', function(sender, param) {
var response = Ext.util.JSON.decode(param.responseText);
if (response.success) {
}, { scope: this });

31 May 2007, 11:19 AM
From the Ext perspective it is not important to know what system or language runs on the server and from the server's perspective it is not important to know which client is sending data.

The first thing the programmer of designer should learn is to assume viewpoints of Ext and server and to be able to swiftly shift them as necessary.

Server perspective:
Server has two basic methods to receive data: GET (data is part of url) or POST. POST is better in majority cases but the principle is same: Server gets name/value pair(s). The Apache (as an example) does not do anything with these pairs but passes them to the underlying server application, PHP in your case, and PHP has to process them. Usually name is the name of a field in a table and value is value to be written.

Client, Ext perspective:
Client has to create date/value pairs and invoke an XHR request that sends these pairs to the server. Also, the Ext expects some response from the server that data was received and/or processed successfully, or error message(s) otherwise.

Be you I would create the simplest thing that can be: ONE name value pair in Ext, then I would send it to server. On the server I'd just echo back the data with the success response (later maybe also with error response to see how it works).

Once this would be running I'd started to complicate the whole thing by writing the incoming data to sql server on the server side and by displaying nice messages and error handlings on client side, adding all data, etc.

This is not any code nor a do-this-and-it-will-work advice. It's just way of thinking advice.

Hope it helps.


31 May 2007, 11:29 AM
Which I understand pretty much from learning PHP and doing Inserts from a Post.

I think I understand or can learn the way JSON factors into this.

The question I have is...is there no method or property to create the JSON of the changed records in the ext.grid? Or do I need to do as the person upthread suggested and loop thru the changed records.

You know how there is that function that will make name:value pairs from every object in the form object? Does that not exist in ext in regards to editable grids?

The solution above seems logical to me but I'm surprised there is not an easier method to accomplish this.

31 May 2007, 11:33 AM
There isn't a standard way to do it b/c it would probably not be efficient to push the entire data store back to the server. You need to decide what really has to go back and in what format your server expects it.

31 May 2007, 12:05 PM
Thanks for replying.

I think i'm not asking my question properly.

Perhaps this is improved:

Q: Is there a property/method to return an array of name/values pairs of all *changed*, *uncommitted* records in the dataStore? Or is there a better way to do this than looping thru them and building a temporary array?

I guess this would be the opposite of dataReader, and there would be one for JSON and XML???

31 May 2007, 12:13 PM
The very first line of willydee's post gives you what you want.

27 Jun 2007, 8:21 AM
Here's an alternative to posting JSON back since my server language currently does not support JSON so I need to post the grid as name/value pair back.

I'm posting back the entire grid but you can also post back only the modified rows.

jsonData = "";

for(i=0;i<cartGridDS.getCount();i++) {
record = cartGridDS.getAt(i);
for (j=0;j<record.fields.length;j++) {
fieldName = record.fields.keys[j];
jsonData += '&' + fieldName + '_' +i+ '='+ record.data[fieldName];


//waitMsg: 'Saving changes, please wait...',
success:function(form, action) {
alert('Congrats! Your changes were saved!!!!');
failure: function(form, action) {
alert('Oops the delete did not work out too well!');