日期:2014-05-16 浏览次数:20792 次
Ext.onReady(function(){
	//创建数据表格
	var datas  = [
	['张三','男',true,new Date(1988,02,12),2500],
	['李四','男',false,new Date(1989,03,22),3500],
	['小红','女',false,new Date(1989,03,22),3500],
	['李四','男',false,new Date(1989,03,22),3500],
	['李四','男',false,new Date(1989,03,22),3500],
	['小花','女',false,new Date(1989,03,22),3500],
	['李四','男',false,new Date(1989,03,22),3500],
	['小萌','女',false,new Date(1989,03,22),3500],
	['李四','男',false,new Date(1989,03,22),3500],
	['小敏','男',true,new Date(1989,12,12),2500]
	];
	
	//创建Grid表格组件
	Ext.create('Ext.grid.Panel',{
	title : 'Grid示例',
	renderTo : Ext.getBody(),
	width : 600,
	hegiht : 350,
	frame : true,
	viewConfig:{
	    forceFit : true,
	    stripeRows : true //在表格中显示斑马线
	},
	store : {  //配置数据源
		fields : ['name','sex','leader','birthday','salary'], //定义字段
		groupField : 'sex',//设置分组字段
		proxy : {
			type : 'memory', //Ext.Date.proxy.Memory内存代理
			data : datas, //读取内嵌数据
			reader : 'array' //Ext.data.reader.Array解析器
		},
		autoLoad : true  //自动加载
	},
	plugins:[Ext.create('Ext.grid.plugin.CellEditing',{
	    clicksToEdit : 2//设置鼠标单击一次进入编辑状态
	})
	],
	setType : 'cellmodel',//设置为单元格选择模式
	features:[Ext.create('Ext.grid.feature.Grouping',{
	    groupByText : '用本字段分组',
	    showGroupsText : '显示分组',
	         groupMeaderTp1 : '性别:{name} ({rows.length})',//分组标题模板
	         startCollapsed : true //设置初始分组是否收起
	}),
	{
        ftype: 'summary'//Ext.grid.feature.Summary表格汇总特性  	
	}],
	columns : [  //配置表格列
	{header : "行号" ,width : 35,
	    xtype: 'rownumberer' //Ext.grid.column.RowNumberer
	},
	{header : "姓名" ,width : 80,dataIndex :'name',flex: 1,
	    summaryType:'count',//求数量
	    summaryRenderer:function(value){
	          return '员工总数:'+value 
	    },
	    editor:{//文本字段
	      xtype:'textfield',