Ext Js数据的请求与响应

store的定义

var store = Ext.create('Ext.data.Store', {
    model: 'User',
    proxy: {
        type: 'ajax',
        url : 'users.json',
        reader: {
            type: 'json'
        }
    }
});

proxy的类型

Types of Proxy
	There are two main types of Proxy
	    - Ext.data.proxy.Client 
		 	The Client proxies save their data locally and include the following subclasses:
			Ext.data.proxy.LocalStorage - saves its data to localStorage if the browser supports it
			Ext.data.proxy.SessionStorage - saves its data to sessionStorage if the browsers supports it
			Ext.data.proxy.Memory - holds data in memory only, any data is lost when the page is refreshed
	   - Ext.data.proxy.Server. 
		 	The Server proxies save their data by sending requests to some remote server. These proxies include:
			Ext.data.proxy.Ajax - sends requests to a server on the same domain
			Ext.data.proxy.JsonP - uses JSON-P to send requests to a server on a different domain
			Ext.data.proxy.Rest - uses RESTful HTTP methods (GET/PUT/POST/DELETE) to communicate with server
			Ext.data.proxy.Direct - uses Ext.direct.Manager to send requests

在响应数据中配置Ext Js的Reader

在响应数据中添加metaData属性以改变reader的行为

{
    "count": 1,
    "ok": true,
    "msg": "Users found",
    "users": [{
        "userId": 123,
        "name": "Ed Spencer",
        "email": "ed@sencha.com"
    }],
    "metaData": {
    	//配置真实数据的根属性名称
        "rootProperty": "users",
        //数据条数属性名称
        "totalProperty": 'count',
        //成功标志的名
        "successProperty": 'ok',
        //返回消息的属性名称
        "messageProperty": 'msg'
    }
}

当metaData发生改变的时候会触发metachange事件，比如我们可改变表格的列

返回的数据

// response format:
{
    ...
    "metaData": {
        "fields": [
            { "name": "userId", "type": "int" },
            { "name": "name", "type": "string" },
            { "name": "birthday", "type": "date", "dateFormat": "Y-j-m" },
        ],
        "columns": [
            { "text": "User ID", "dataIndex": "userId", "width": 40 },
            { "text": "User Name", "dataIndex": "name", "flex": 1 },
            { "text": "Birthday", "dataIndex": "birthday", "flex": 1, "format": 'Y-j-m', "xtype": "datecolumn" }
        ]
    }
}

meteData事件定义

var store = Ext.create('Ext.data.Store', {
    ...
    listeners: {
        'metachange': function(store, meta) {
            myGrid.reconfigure(store, meta.columns);
        }
    }
});