View Full Version : Posting Question

8 Aug 2007, 11:21 AM
Is is possible to get a Ext form to post JSON formatted data via the Request.Form to an .ASPX page out of the box?

As far as I can see I can only send data this way in the format of firstname=Joe&surname=Bloggs and so on.

Or do I have to create the JSON text manually in JavaScript before submitting via a generic handler to a .ashx file?

Thanks in advance for any guidance.

8 Aug 2007, 12:47 PM
Try using Ext.encode (http://extjs.com/deploy/ext/docs/output/Ext.html#encode) to encode your Json string and then send it via Ext.data.Connection (http://extjs.com/deploy/ext/docs/output/Ext.data.Connection.html). There should be examples around the forums.

Here is an example from another thread (http://extjs.com/forum/showthread.php?t=10120) that uses this method:

grid.on('afteredit',function(oe) {


* oe.grid - This grid
* oe.record - The record being edited
* oe.field - The field name being edited
* oe.value - The value being set
* oe.originalValue - The original value for the field, before the edit.
* oe.row - The grid row index
* oe.column - The grid column index

var data = new Array;
Ext.each (grid.getDataSource().getModifiedRecords(), function(record) {

var jsondata = Ext.util.JSON.encode(data);
var conn = new Ext.data.Connection();
method: 'POST'
, url: 'json-upload.php'
, params: { action: 'update', data: jsondata }

conn.on('requestcomplete', function(sender, param) {

//alert (param.responseText);
var response = Ext.util.JSON.decode(param.responseText);
if (response.result == 'OK') {
// refresh local data ...
// ... and reload the grid
ds.load({params:{start:0, limit:myPageSize}});
// Ext.example.msg(response.result, response.message);
else {
Ext.MessageBox.alert(response.result, response.message);

}, { scope: grid });


10 Aug 2007, 1:15 AM
Thanks for the reply and the example.

I've just tried this approach posting to a .aspx page not PHP and it still comes through via the Request.Form in a format of firstname=joe&surname=bloggs not JSON string. The other difference I have is I'm taking the data from TextField controls rather than a row in a grid.

The only way I've been able to do this so far is to create a generic handler (.ashx) on the server side (.NET) and make a call to that passing a JSON string created in JavaScript.


contains references to Jayrock script and server side .ashx

<script type="text/javascript" src="json.js"></script>
<script type="text/javascript" src="SaveFormData.ashx?proxy"></script>

.JS file

simple.addButton('Save', function(){
if (simple.isValid()) {

var serverSideCall = new SaveFormData();

// Create a dynamic Javascript object
var oPerson = new Object();

oPerson.Title = Ext.get('title').dom.value;
oPerson.Firstname = Ext.get('firstname').dom.value;
oPerson.Surname = Ext.get('surname').dom.value;
oPerson.Sex = Ext.get('sex').dom.value;
oPerson.Email = Ext.get('email').dom.value;

// This is a script provided by Jayrock which I use on the server side as well.
var jsonObj = JSON.stringify(oPerson);

// Send the JSON to the server side generic handler
var text = serverSideCall.save(jsonObj);

Ext.Msg.alert('Saved', 'Form data saved ok');

} else {
Ext.Msg.alert('Errors', 'Please fix the errors noted');
}, simple);

ASHX file

[JsonRpcMethod("save", Idempotent = true)]
[JsonRpcHelp("Save a JSON object into a matching business object.")]
public string save(string text)
Person newPerson = (Person)JsonConvert.Import(typeof(Person), text);
catch (Exception ex)
// deal with exception

This approach seems to work fine but I'm not sure if it's the best way to do this.

Anyone have any thoughts on this?