封装表格显示数据GridPanel

/**
 * 封装GridPanel
 */
Ext.dream = {

	/**
	 * url:请求的地址 record:记录对象 tbar:顶部工具栏 columnModel:需要显示的列 pageSize:每页显示的记录数 
	 * var cfg = {};
	 * cfg['fields'] = fields; 
	 * cfg['url'] = 'server.jsp';
	 * cfg['recordName'] = "Menu"; 
	 * cfg['record'] = Menu; 
	 * cfg['tbar'] = topBar;
	 * cfg['columnModel'] = columnModel; 
	 * cfg['pageSize'] = 4; 
	 * cfg['sm'] = sm;配置列选择模式
	 */
	createGridPanel : function(cfg) {

		// 定义信息数据集对象
		var dataStore = new Ext.data.Store( {
			autoLoad : false,
			url : cfg.url,
			reader : new Ext.data.XmlReader( {
				totalRecords : "totalNum",
				record : cfg.recordName
			}, cfg.record)
		// XmlReader结束
		});// 数据集对象创建结束

		var pagingBar = new Ext.PagingToolbar( {
			store : dataStore,
			pageSize : cfg.pageSize,
			displayInfo : true,
			displayMsg : '第{0}条到第{1}条,一共{2}条',
			emptyMsg : "没有信息"
		});

		// 创建Grid表格组件
		var gridPanel = new Ext.grid.GridPanel( {

			border : false,
			width : Ext.get('box').getWidth(),
			frame : true,
			tbar : cfg.tbar,
			bbar : pagingBar,
			store : dataStore,
			stripeRows : true,
			viewConfig : {
				forceFit : true
			},
			sm : cfg.sm,// 列选择模式
			cm : cfg.columnModel
		});// 创建grid表格结束
		dataStore.load( {
			params : {
				start : 0,
				limit : cfg.pageSize
			}
		})
		return gridPanel;
	}
};

你可能感兴趣的:(jsp,ext)