1.定义数据存储器:?
var blackStore = new Ext.data.Store({
proxy:new Ext.data.HttpProxy({
url:'$base/blacklist/getResult.o', //请求后台的URL
method:'post'
}),
reader:new Ext.data.JsonReader({ ? //以JSON方式读取数据, 此处的reader很容易错写成render.
root:'newList', ??//newList结果集的名称
totalProperty:'totalProperty' //totalProperty总记录数的名称
},[{name:'number'},{name:'source'}]
)
});
blackStore.load({params:{'start':0, 'limit':20}});//注意,要在此处调用,因为当Grid渲染到div后再调用的话,Grid将不会显示数据
?
?
?
blackStore.on('beforeload',function(){ ? ?
? ? ? ?Ext.apply( ? ?
? ? ? ?this.baseParams, ? ?
? ? ? ?{ ? ?
? ? ? ? ? ?'blacklist.number':Ext.getCmp('number').getValue(),?
? ? ? ? ? ?'blacklist.source':Ext.getCmp('source').getValue()
? ? ? ?}); ? ?
? ?}); ?//在store重新加载数据时,将查询条件重新传到后台.
?
2.定义Grid显示的列
var blackCol = new Ext.grid.ColumnModel([
{header:'电话号码',dataIndex:'number',width:500},
{header:'号码来源',dataIndex:'source',width:300}
]);
?
3.定义Grid ?
blackCol.defaultSortable = true ; //设置列默认可排序
?
var blackGrid = new Ext.grid.GridPanel({//定义表格列表
el:'blackListGrid',
width:820,
defaults: {anchor:'95%'},
height:500,
title:'列表',
store:blackStore,
cm:blackCol,
loadMask:{msg:'正在加载数据,请稍候...'},
bbar:new Ext.PagingToolbar({
pageSize:20,
store:blackStore,
displayInfo:true,
displayMsg:'显示第{0} 条到第{1}条记录,一共{2}条记录',
emptyMsg:'没有记录'
})
});
blackGrid.render();