EXT常用功能技巧汇总：网格组件与选择模型

1.序号修改说明：
在列表中不存在序号的，“columns: [”后添加一项“{xtype: 'rownumberer',resizable:true },”,其中resizable属性定义了该列是否允许拉宽，再序号较大时如“100”可能显示成“1...”需要使用
2.通过选择列表中的项数改变对应功能按钮的显示状态：
首先设置功能按钮的id值，然后在Ext.grid.Panel之前定义如下：
var sm = new Ext.selection.CheckboxModel({
            listeners:{
            'selectionchange':function(sm){
                var len = sm.getSelection().length;
               if(len > 1){
               Ext.getCmp('viewbutton').setVisible(false);
               Ext.getCmp('editbutton').setVisible(false);
               }
               else{
               Ext.getCmp('viewbutton').setVisible(true);
               Ext.getCmp('editbutton').setVisible(true);
               }
            }
          }
        });
然后在Ext.grid.Panel中定义“selModel: sm,”，这样就可以设定为当选择数据行数大于1条时，查看和编辑按钮不显示。
3.设置列表中为单选，并且列表头中的复选框不显示，此时可以不使用multiSelect: false,属性
var sm = Ext.create('Ext.selection.CheckboxModel',{showHeaderCheckbox : false,mode:'SINGLE'});
selModel: sm,  
4.设置“selModel:'RowModel',”或者“selType: 'rowmodel',”则没有复选框，只能单选
5.设置列表中的数据列宽可以拉伸enableColumnResize: true,
6.设置列表中的数据可以读取viewConfig:{enableTextSelection:true},
7.按钮中如果引用扩展的/CESEMDMS/WebRoot/ext4.1/css/icons.css中定义的图片，需在页面中引用<link rel="stylesheet" href="${ctx }/ext4.1/css/icons.css">
8.设置panel为可折叠方式。collapsible: true,//可折叠
9.去掉当前页面中列表下方的刷新按钮：在<script type="text/javascript" src="${ctx }/ext4.1/ext-all.js"></script>下面添加引用
<script type="text/javascript" src="<%=path%>/ext4.1/ext-rewrite.js"></script>