Ext.grid.GridPanel按比值自动分配列宽

	/* 创建选择模式对象.多选框*/
	var cb = new Ext.grid.CheckboxSelectionModel(
			{
			width:20,//宽度
			singleSelect:true//是否是单选，true为单选。默认false。
			});
 var colM = new Ext.grid.ColumnModel([ 
    	　 cb,
          new Ext.grid.RowNumberer({//创建行号
						header : 'NO.',
						width : 30,
						dataIndex : "id"
					}), {
				header : "名称",
				width : 2,//注意如果girdPanel中设置了viewConfig: {forceFit:true},
						  // 此时分配列宽时时按着各列的width的比例分配的。如果不写width则平均分配。
						  //例如三列的比例为：2：4：1
						  //可以直接将width写为2，4，1.这时候会按着2：4：1的比例自动分配列宽
				dataIndex : 'name',
				sortable : true//可排序
			}, {
				header : "备注",
				width :4,
				dataIndex : 'memo',
				sortable : true
			}, {
				header : "日期",
				width : 1,
				dataIndex : 'time'
			}

	]);
	/*gird的数据装载器*/
	var store = new Ext.data.JsonStore({
				url : 'myUrl',//action路径
				root : 'items',//要求返回数据json格式为：{results:3,items:[{},{},{}]}
				totalProperty : "results",
				fields : ['id','name','memo','time']
			});
	/*分页工具栏*/
	var pageBar = new Ext.PagingToolbar({
                store : store,
                pageSize : pageSize,
                displayInfo : true,
                displayMsg : '第 {0} 条到  {1} 条, 一共 {2} 条',
                emptyMsg : "没有记录",
                beforePageText : '页码',
                afterPageText : '总页数 {0}',
                firstText : '首页',
                prevText : '上一页',
                nextText : '下一页',
                lastText : '末页',
                refreshText : '刷新'
            });          
	var grid = new Ext.grid.GridPanel({
		id : 'grid',//唯一标示
		frame : true,//背景颜色
		store : store,//数据装载器
		region : "center",//如果父容器用borer布局时，该grid位于中心。
		enableHdMenu : false,//设置表头不可用
		labelAlign : 'left',//文字居左
		viewConfig: {forceFit:true}, //自动分配列宽
		loadMask : true,//显示加载提示
		cm : colM,//列模型
		sm:cb,//多选框         
        bbar : pageBar//分页工具栏
		});

1 楼 fan2012 2010-08-03  

注释非常好