Ext Grid 综合

最新推荐文章于 2021-01-12 15:18:23 发布

hwpokay

最新推荐文章于 2021-01-12 15:18:23 发布

阅读量80

点赞数

分类专栏： EXT 文章标签： EXT

EXT 专栏收录该内容

13 篇文章 0 订阅

订阅专栏

今晚,说不出的高兴,折磨了我好久的Grid终于可以按搜索条件分页了,激动啊....

function listStudent() {
 function renderSex(value) {
 if (value == 'boy') {
 return " 男 " ;
 } else {
 return " 女 " ;
 }
 }
 var sm = new Ext.grid.CheckboxSelectionModel();
 var cm = new Ext.grid.ColumnModel([ new Ext.grid.RowNumberer(), sm, {
 header : '编号',
 dataIndex : 'id',
 width : 80 ,
 sortable : true
 }, {
 header : '名称',
 dataIndex : 'name',
 width : 80
 }, {
 header : '性别',
 dataIndex : 'sex',
 renderer : renderSex
 }, {
 header : '日期',
 dataIndex : 'date',
 width : 100 ,
 renderer : Ext.util.Format.dateRenderer('Y - m - d')
 }, {
 header : '描述',
 dataIndex : 'descn',
 width : 200
 }]);
 var ds = new Ext.data.Store({
 proxy : new Ext.data.HttpProxy({
 url : ' / ext / list.jspa'
 }),
 reader : new Ext.data.JsonReader({
 totalProperty : 'total',
 root : 'persons'
 }, [{
 name : 'id'
 }, {
 name : 'name'
 }, {
 name : 'sex'
 }, {
 name : 'date',
 type : 'date',
 dateFormat : 'Y - m - dTH:i:s'
 }, {
 name : 'descn'
 }])
 });
 ds.load({
 params : {
 start : 0 ,
 limit : 18
 }
 });

 ds.on('beforeload', function (){
 Ext.apply(
 this .baseParams,
 {
 title:Ext.get('title').dom.value
 });
 });

 var grid = new Ext.grid.GridPanel({
 el : 'grid',
 ds : ds,
 cm : cm,
 sm : sm,
 border : false ,
 autoExpandColumn : 5 ,
 tbar : ['关键字查询：', {
 xtype : 'textfield',
 width : 200 ,
 id : 'title',
 name : 'title'
 }, {
 text : '搜索',
 iconCls : 'search',
 handler : function () {
 ds.load({
 params : {
 start : 0 ,
 limit : 18 ,
 title : Ext.get('title').dom.value
 }
 })
 }
 }, {
 xtype : 'tbseparator'
 }, {
 text : '发布',
 iconCls : 'edit'
 }, {
 xtype : 'tbseparator'
 }, {
 text : '查看',
 iconCls : 'copy'
 }, {
 xtype : 'tbseparator'
 }, {
 text : '刷新',
 iconCls : 'refresh'
 }, {
 xtype : 'tbseparator'
 }, {
 text : '回复',
 iconCls : 'post'
 }, {
 xtype : 'tbseparator'
 }, {
 text : '删除',
 iconCls : 'del'
 }],
 bbar : new Ext.PagingToolbar({
 pageSize : 18 ,
 store : ds,
 displayInfo : true ,
 displayMsg : '第{ 0 } 到 { 1 } 条数据共{ 2 }条',
 emptyMsg : '没有数据'
 })
 });
 grid.render();
}
Ext.onReady(listStudent);