Ext.onReady(function ()
{
//建立一个store要使用的Model
Ext.define("User", {
extend: "Ext.data.Model",
fields: [
{ name: "firstName", type: "string" },
{ name: "lastName", type: "string" },
{ name: "age", type: "int" },
{ name: "eyeColor", type: "string" }
]
});
var myStore = Ext.create("Ext.data.Store", {
model: "User",
proxy: {
type: "ajax",
url: "/Json/users.json",
reader: {
type: "json",
root: "users"
}
},
autoLoad: true
});
//创建Ext.grid.Panel组件
Ext.create("Ext.grid.Panel", {
title: "Simple Load Json Data",
store: myStore,
columns: [
{ header: "FirstName", dataIndex: "firstName" },
{ header: "LastName", dataIndex: "lastName" },
{ header: "Age", dataIndex: "age" },
{ header: "EyeColor", dataIndex: "eyeColor" }
],
height: 300,
width: 400,
renderTo: Ext.getBody()
});
});
users.json代码如下:
{
"users": [
{ "firstName": "Lisa", "lastName": "lisa@qq.com", "age": 25,"eyeColor": "Yellow" },
{ "firstName": "Lisa", "lastName": "lisa@qq.com", "age": 25,"eyeColor": "Yellow" },
{ "firstName": "Lisa", "lastName": "lisa@qq.com", "age": 25,"eyeColor": "Yellow" },
{ "firstName": "Lisa", "lastName": "lisa@qq.com", "age": 25,"eyeColor": "Yellow" },
{ "firstName": "Lisa", "lastName": "lisa@qq.com", "age": 25,"eyeColor": "Yellow" },
{ "firstName": "Lisa", "lastName": "lisa@qq.com", "age": 25,"eyeColor": "Yellow" },
{ "firstName": "Lisa", "lastName": "lisa@qq.com", "age": 25,"eyeColor": "Yellow" },
{ "firstName": "Lisa", "lastName": "lisa@qq.com", "age": 25,"eyeColor": "Yellow" },
{ "firstName": "Lisa", "lastName": "lisa@qq.com", "age": 25,"eyeColor": "Yellow" },
{ "firstName": "Lisa", "lastName": "lisa@qq.com", "age": 25,"eyeColor": "Yellow" }
]
}