I am using extjs(4.1.0) MVC . I have a custom grid set up with combo box filter, datepicker filters etc. I am attaching snippets from the controller, view, and store.
I response coming in is different from the model, hence, the response is intercepted by overriding a read() of the story proxy. Also data needs to be sent as Json data in payload, so the buildRequest() of store proxy is also overridden to add json data to request. (all sort, paging params are also added here) Adding to this - the view has infinite scrolling.
The view loads fine the first time. But on combobox change/date change, store is reloaded with passing these as json params in request.
I see the response in XHR in firebug/chrome, but the grid continously shows the loading mask, waiting for loading.. Kindly help on what could be going wrong.
Ext.define('Message.store.ListingStore', {
extend: 'Ext.data.Store',
model: 'Message.model.ListingModel',
autoLoad: true,
remoteSort: true,
purgePageCount:0,
buffered: true,....
.......
proxy: {
type: 'ajax',
actionMethods: {
read: 'POST'
},
url: 'http://localhost:8080
buildRequest: function(operation) {
Ext.apply(request, {
params: null,
jsonData: Ext.apply(request.params, {
page: operation.page,
start: operation.start,
limit: operation.limit,
catId:catValue,
sort:operation.sorters[0].property,
dir:operation.sorters[0].direction
})
});
........return request;
}
root: 'data',
totalProperty:'total',
successProperty :'success'
},
.....
});
//controller
Ext.define('Message.controller.Listing', {
extend:'Ext.app.Controller',
stores: ['ListingStore','SubscriptionStore','SubCategoryMasterStore','PriorityMasterStore'],
models: ['ListingModel'],
views: [
'MessageListing'
],
init:function () {
var controller = this;
'messagelisting combo' : {
select : this.handleComboSelect
},
'messagelisting datefield' : {
select : this.handleDateSelect
},
.....
handleComboSelect : function(gridview, el, rowIndex, colIndex, e, rec, rowEl) {
this.getStore('ListingStore').load();
},
handleDateSelect: function(gridview, el, rowIndex, colIndex, e, rec, rowEl) {
this.getStore('ListingStore').load({callback: function(response){
}});
This is a very complex case, so i am unable to post the entire code. Thank You.