Ext4.2 grid插入复选框，行号，指定顺序

阅读更多

 

一、行号

var rm = new Ext.grid.RowNumberer({header : '',width : 28}),
或 {xtype: 'rownumberer', header: '', width: 28},

 

二、复选框

//创建checkBox 列
	var selModel = Ext.create('Ext.selection.CheckboxModel',{
		injectCheckbox: 1	  //插入的位置
        //mode: "SIMPLE",     //"SINGLE"/"SIMPLE"/"MULTI"
        //checkOnly: true     //只能通过checkbox选择
	});

 

在Ext4的grid中配置selModel，不是Ext3中的sm了

我选择在grid中配置selType和selModel，我想把配置都写在一起

var gridOrganization = Ext.create('Ext.grid.Panel', {
	    title: '组织机构列表',
	    region: 'center',
	    margins: '3 0 0 0',
	    store: stoOrganization,
	    selType: "checkboxmodel",
	    selModel: {
	        injectCheckbox: 1	//插入的位置
//	        mode: "SIMPLE",     //"SINGLE"/"SIMPLE"/"MULTI"
//	        checkOnly: true     //只能通过checkbox选择
	    },
	    columns: [
	        //new Ext.grid.RowNumberer({header : '',width : 28}),
	        {xtype: 'rownumberer', header: '', width: 28},
	        //selModel,
	        { header: 'id',  dataIndex: 'id', hidden: true},
	        { header: 'parentId', dataIndex: 'parentId', hidden: true, flex: 1 },
	        { header: '代码', dataIndex: 'code'},
	        { header: '名称', dataIndex: 'name' },
	        { header: '排序号', dataIndex: 'sortno' }
	    ],
//	    dockedItems: [{
//	        xtype: 'pagingtoolbar',
//	        store: stoOrganization,   // GridPanel中使用的数据
//	        dock: 'bottom',
//	        displayInfo: true
//	    }]
	    tbar: Ext.create('Ext.toolbar.Toolbar', {
	        items: [
	            {
	                // xtype: 'button', // 默认的工具栏类型
	                text: '新增',
	                id : 'btn_add',
					iconCls : 'addIcon',
					handler : function() {
						initAdd();
					}
	            }, {
	                text: '修改',
	                id : 'btn_modify',
	                iconCls : 'page_edit_1Icon',
					handler : function() {
						initModify();
					}
	            }, {
	                text: '删除',
	                id : 'btn_remove',
	                iconCls : 'page_delIcon',
					handler : function() {
						remove();
					}
	            }
	        ]
	    }),
	    bbar: Ext.create('Ext.PagingToolbar',{
            store: stoOrganization, 
            displayInfo: true, 
            items : ['-', '  ', pagesize_combo]
//            displayMsg: 'Displaying topics {0} - {1} of {2}', 
//            emptyMsg: "No topics to display", 
	    }),
	    listeners: {
	    	//'itemclick' : function(view,record,item,index,e,eOpts){ 
	    	itemdblclick: function(view,record,item,index,e,eOpts){
	    		//alert(record.data.id);
	    		formPanelDetails.getForm().reset();
	    		formPanelDetails.loadRecord(record);
	    		winDetails.show();
	    	}
	    }
	});