How to post data using ExtJs Store

[webfriend13]

Hi all,

Please look at the following store:




var store = new Ext.create('Ext.data.ArrayStore', {
id: 'store',
autoLoad: false,
buffered: true,
pageSize: 50,
fields: resultFields,
remoteSort: true,
proxy: {
type: 'ajax',
url: '/url/results',
jsonData: jsonStr,
actionMethods: {
create: 'POST',
read: 'POST',
update: 'POST',
destroy: 'POST'
},
extraParams: {
userName: 'fid'
},
reader: {
root: 'data',
totalProperty: 'totalCount'
}
}
});



I am not able to "POST" the data using Extjs Store. I am able to see the extra params which i am sending but not the data I am trying to send using jsonData config. The same code works when i use Ext.Ajax.request.

Please note: I dont want to send data available in my store. I want to send data available in 'jsonStr' variable declared somewhere in my program



//with following code I am able to post data to server
Ext.Ajax.request({
url: '/url/results',
method: 'POST',
//Send the query as the message body
jsonData: jsonStr,
params: {
userName: 'fid'
}
});



Please provide your suggestions.

[scottmartin]

You could send the data as a param?

params: {
jsonData: jsonStr
}

Regards,
Scott.

[webfriend13]

I used following link and used it to POST the data.

http://www.sencha.com/forum/showthread.php?156847-ExtJs-4-Store-Proxy-AJAX-request-POST-xmlData

Following is my code.





Ext.define('Ext.ux.data.proxy.Ajax', { requires: ['Ext.util.MixedCollection', 'Ext.Ajax'], extend: 'Ext.data.proxy.Ajax', doRequest: function (operation, callback, scope) { var writer = this.getWriter(), request = this.buildRequest(operation, callback, scope); if (operation.allowWrite()) { request = writer.write(request); } Ext.apply(request, { jsonData: jsonStr, headers: this.headers, timeout: this.timeout, scope: this, callback: this.createRequestCallback(request, operation, callback, scope), method: this.getMethod(request), disableCaching: false // explicitly set it to false, ServerProxy handles caching }); Ext.Ajax.request(request); return request; } }); store = new Ext.create('Ext.data.ArrayStore', { id: 'store', autoLoad: false, buffered: true, pageSize: 100, fields: resultFields, remoteSort: true, proxy: Ext.create(Ext.ux.data.proxy.Ajax, { type: 'ajax', url: '/mdx/results', actionMethods: { create: 'POST', read: 'POST', update: 'POST', destroy: 'POST' }, extraParams: { connName: PA.common.Connection.getConnName() }, reader: { root: 'data', type: 'array', totalProperty: 'totalCount' } }) //End of proxy }); store.guaranteeRange(0, 99); //create the group feature to group the headers var groupingFeature = Ext.create('Ext.grid.feature.Grouping', { groupHeaderTpl: 'Group: {name} ({rows.length})', startCollapsed: true }); //Prepare the grid var grid = Ext.create('Ext.grid.Panel', { id: 'resultgrid', store: store, enableColumnHide: false, enableColumnMove: false, columnLines: true, columns: resultColumns, viewConfig: { stripeRows: true }, features: [groupingFeature] });

[mazhar.shaikh]

If I have my code looking as follows, how would I use your suggestion:


var grid = Ext.getCmp('reviewPicklistGrid');
var store = Ext.getStore('GeneratePicklist');
var selection = grid.getSelectionModel().getSelection();
if (selection.length > 0){
var jsonData = Ext.encode(Ext.Array.pluck(selection, 'data'));
store.proxy.url = PickList.globals.url + 'Orders/PrintPicklist'; // MY URL
store.sync();
console.log(jsonData);
}


Thanks