How to POST data in JSON format in ExtJS 4 Ext.data.store
2014-12-05 15:19
615 查看
Hello Everyone,
This is my First Post related to ExtJS.
Normally ExtJS 4 Data is sent in Url encoded format which in my web service code was not getting accepted. So I tried searching over the internet, but didn't got much help.
So I thought of writing of my own, following is the code which actually converts my required params and send it to webservice in JSON format in POST.
Normally based on your JSON data representation you can modify based on your need. in beforeload listeners in grid.
原文地址:http://irscomp.blogspot.com/2012/01/how-to-post-data-in-json-format-in.html
或者使用以下方法:
Ext.override(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, {
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
});
//Added... jsonData is handled already
if(this.jsonData) {
request.jsonData = Ext.encode(request.params);
delete request.params;
}
Ext.Ajax.request(request);
return request;
}
});
使用以下方法调用:
Ext.define('My.Store',
extend: 'Ext.data.Store',
...
proxy: {
type: 'ajax',
...
//Add these two properties
actionMethods: {
read: 'POST'
},
jsonData: true //Custom, used in override
}
});本方法来源地址:http://www.sencha.com/forum/showthread.php?196194-Ajax-Store-Send-Params-as-JSON-Body
This is my First Post related to ExtJS.
Normally ExtJS 4 Data is sent in Url encoded format which in my web service code was not getting accepted. So I tried searching over the internet, but didn't got much help.
So I thought of writing of my own, following is the code which actually converts my required params and send it to webservice in JSON format in POST.
Normally based on your JSON data representation you can modify based on your need. in beforeload listeners in grid.
store.proxy.jsonData = { /*** Your JSON data here ***/}; //Source Code Attached functionrenderMyGrid(){ Ext.define('SampleModel', { extend: 'Ext.data.Model', fields: ['id', 'name', 'location', 'description', 'owner'], idProperty: 'id' }); var store = Ext.create('Ext.data.Store', { pageSize: 20, autoLoad: true, model: 'SampleModel ', remoteSort: true, proxy: { type: 'ajax', actionMethods: { create : 'POST', read : 'POST', update : 'POST', destroy: 'POST' }, 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, { headers : this.headers, timeout : this.timeout, scope : this, callback : this.createRequestCallback(request,operation, callback, scope), method : this.getMethod(request), jsonData : this.jsonData, disableCaching:false// explicitly set it to false, ServerProxy handles caching }); Ext.Ajax.request(request); return request; }, headers:ajaxCallHeader, timeout:ajaxCallTimeout, url:servicePath+'SampleService/loadGridData', reader: { root: 'data', totalProperty: 'total' }, writer: { type: 'json', encode: true }, simpleSortMode: true }, sorters: [{ property: 'name', direction: 'ASC' }], listeners: { beforeload: function(store, operation,eOpts) { store.proxy.jsonData = {"pagination" : {"page":operation.page, "limit":operation.limit, "sort":operation.sorters[0].property, "dir":operation.sorters[0].direction }, "basicInfo" : {"ccoId":remoteUser, "prefLang":"eng_US", "requestStartDate":(new Date()).format("isoDateTime"), "requesterApp":appName } }; } } }); var grid = Ext.create('Ext.grid.Panel', { region: 'center', layout: 'fit', id: objId, store: store, loadMask: true, viewConfig: { id: 'gv', trackOver: true, stripeRows: true }, // grid columns columns:[{ id: 'name', text: "Name", dataIndex: 'name', sortable: true },{ text: "Location", dataIndex: 'location', width: 200 },{ text: "Description", dataIndex: 'descripion', width: 200 }], bbar: Ext.create('Ext.PagingToolbar', { store: store, displayInfo: true, displayMsg: 'Displaying topics {0} - {1} of {2}', emptyMsg: "No topics to display" }), }); grid.store.loadPage(1); return grid; }
原文地址:http://irscomp.blogspot.com/2012/01/how-to-post-data-in-json-format-in.html
或者使用以下方法:
Ext.override(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, {
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
});
//Added... jsonData is handled already
if(this.jsonData) {
request.jsonData = Ext.encode(request.params);
delete request.params;
}
Ext.Ajax.request(request);
return request;
}
});
使用以下方法调用:
Ext.define('My.Store',
extend: 'Ext.data.Store',
...
proxy: {
type: 'ajax',
...
//Add these two properties
actionMethods: {
read: 'POST'
},
jsonData: true //Custom, used in override
}
});本方法来源地址:http://www.sencha.com/forum/showthread.php?196194-Ajax-Store-Send-Params-as-JSON-Body
相关文章推荐
- How to use JSon data in mvc action and post form data use JQuery ajax
- csharp:Learn how to post JSON string to generic Handler using jQuery in ASP.Net C#.
- How to retreive raw post data from HttpServletRequest in java
- How to Trick ESXi 5 in seeing an SSD Datastore
- csharp:Learn how to post JSON string to generic Handler using jQuery in ASP.Net C
- ExtJs中同一个URL构造多个Ext.data.JsonStore
- ExtJs中同一个URL构造多个Ext.data.JsonStore --转载
- Extjs学习笔记——Ext.data.JsonStore使用说明
- How to Read/Save JSON Data in Unity
- How to get the JSON results in ExtJS
- How to retreive raw post data from HttpServletRequest in java
- How to retreive raw post data from HttpServletRequest in java
- csharp:Learn how to post JSON string to generic Handler using jQuery in ASP.Net
- How to save data in ASCII format in ADS for use in MATLAB
- How To contain multiple fileds in the querystrig, DataNavigateUrlFormatString=xxx.asp?ID={0}&Name={1}
- How to retreive raw post data from HttpServletRequest in java
- Google Volley: How to send a POST request with Json data?
- How To Generate An XML File As A Target Datastore Using ODI In An Integration Interface ? [ID 454268
- EXT核心API详解(十一)_Ext.data.Store/GroupingStore/JsonStore/SimpleStore
- [转载]EXT核心API详解Ext.data(十二)-GroupingStore/JsonStore/SimpleStore javascript