Ext.grid.GridPanel的扩展的扩展很简单:
只需要从写下面的部分即可
1.this.sm ,grid的选择模式
2.this.colModel,grid的列模型
3.this.store ,grid的数据来源
如果分页,就在写个this.bbar,在里面放分页菜单this.bbar = {xtype:"paging"};
Ext.namespace("Ext.ux.grid");
/**
* grid
* @class Ext.ux.grid.grid.MyGrid
* @extends Ext.grid.GridPanel
* @author master
*/
Ext.ux.grid.MyGrid= Ext.extend(Ext.grid.GridPanel, {
width: 200,
title:"myGird",
// autoHeight:true,
// autoWidth:true,
allowPage:true,
autoScroll: true,
enableColumnMove: false,
enableHdMenu: false,
initComponent: function()
{
this.sm = new Ext.grid.RowSelectionModel({
singleSelect: true
});
this.colModel = new Ext.grid.ColumnModel([{
header: "ID",
dataIndex: "id",
hidden: true,
fixed: true
}, {
header: "代码",
dataIndex: "code",
sortable: true
}, {
header: "名称",
dataIndex: "name",
sortable: true
}]);
this.store = new Ext.data.JsonStore({
url: "BBM/loadByUserId.action",
root: "list",
method: "post",
totalProperty: "totalCount",
fields: ["id", "code", "name"]
});
if(this.allowPage){
this.bbar = {xtype:"paging"};
}
this.enableDrag = true;
this.enableDragDrop = true;
this.stripeRows = true;
this.loadMask = {
msg: "数据加载中,请稍等..."
};
Ext.ux.grid.MyGrid.superclass.initComponent
.call(this);
this.store.load({start:0,limit:100});
}
});
Ext.reg("myGrid", Ext.ux.grid.MyGrid);
/*Ext.onReady(function()
{
var viewPort = new Ext.Viewport({
layout: 'border',
items: [{
region: 'center',
xtype: 'myGrid'
}]
});
});
*/