日期:2014-05-16 浏览次数:20572 次
Ext.onReady(function(){
//定义数据结构
var fields = ["id","name","email","sex","age"];
//定义数据
//1.数组
// var data = [
// ["1","Troy1","TroyYoung@mwords.com","0","20"],
// ["2","Troy2","TroyYoung@mwords.com","1","21"],
// ["3","Troy3","TroyYoung@mwords.com","1","22"],
// ["4","Troy4","TroyYoung@mwords.com","0","23"],
// ["5","Troy5","TroyYoung@mwords.com","0","24"]
// ];
//2.json数据
var data = {result:[
{id:"1",name:"Troy1",email:"TroyYoung@mwords.com",sex:"0",age:"20"},
{id:"2",name:"Troy2",email:"TroyYoung@mwords.com",sex:"0",age:"21"},
{id:"3",name:"Troy3",email:"TroyYoung@mwords.com",sex:"0",age:"22"},
{id:"4",name:"Troy4",email:"TroyYoung@mwords.com",sex:"0",age:"23"},
{id:"5",name:"Troy5",email:"TroyYoung@mwords.com",sex:"0",age:"24"}
]};
//数据与数据结构的映射格式
// //1.将数据结构和数据组合
// var store = new Ext.data.SimpleStore({
// fields:fields,
// data:data
// });
//2.使用数组数据解析器
// var store = new Ext.data.Store({
// data:data,
// reader:new Ext.data.ArrayReader({id:"id"},fields)
// });
//3.使用json数据解析器
// var store = new Ext.data.Store({
// data:data,
// reader:new Ext.data.JsonReader({id:"id",root:"result"},fields)
// });
//4.使用jsonStore
var store = new Ext.data.JsonStore({
id:"id",
data:data,
fields:fields,
root:"result"
});
//定义表头
var cm = new Ext.grid.ColumnModel([
{header:"id",dataIndex:"id"},
{header:"姓名",dataIndex:"name"},
{header:"Email",dataIndex:"email"},
{header:"性别",dataIndex:"sex"},
{header:"年龄",dataIndex:"age"}
]);
//定义GridPanel
var grid = new Ext.grid.GridPanel({
title:"Grid数据列表显示",
width:600,
autoHeight:true,
cm:cm,
store:store
});
//显示数据
grid.render(Ext.getBody());
});