ext.data.store ajax,ajax - ExtJS store.loadData() doesn't load the JSON data - Stack Overflow

I am trying to load a JSON data which is replied back by an AJAX request to a grid.

My store definition:

Ext.define('Report.store.CustomerDataStore', {

extend: 'Ext.data.Store',

requires: [

'Report.model.Customer'

],

constructor: function(cfg) {

var me = this;

cfg = cfg || {};

me.callParent([Ext.apply({

autoLoad: false,

storeId: 'CustomerDataStore',

model: 'Report.model.Customer',

proxy: {

type: 'ajax',

url: '',

reader: {

type: 'json',

root: 'data',

record: 'fields'

}

}

}, cfg)]);

}

});

There is a button in my app which is defined as follows:

xtype: 'button',

handler: function(button, event) {

var queryform = this.up('form').getForm();

var me = this;

if(queryform.isValid())

{

Ext.Ajax.request({

url: 'customers/', // where you wanna post

success: function(response) {

var mystore = Ext.data.StoreManager.lookup('CustomerDataStore');

var myData = Ext.JSON.decode(response.responseText);

console.log(myData.toSource());

mystore.loadData(myData);

},

jsonData: Ext.JSON.encode(queryform.getValues())

});

}

},

The problem is that my grid doesn't show the replied data! I am sure that my replied JSON format is OK. I have checked it with a json file. also myData.toSource() returns my desired JSON format.

I am pretty confused what I am doing wrong?

Could you plz help?