Extjs grid 复选列定义 鼠标提示 可编辑列定义

2019独角兽企业重金招聘Python工程师标准>>>

var grid = Ext.create('Ext.grid.Panel', {
                //title : "列表信息",
                id: 'grid_gsms',
                bufferedRenderer: false,
                store: store,
                //选择列定义
                selModel: Ext.create('Ext.selection.CheckboxModel', {
                    injectCheckbox: 11,//checkbox位于哪一列，默认值为0
                    multiSelect:true, 
                    mode: 'SIMPLE',//multi,simple,single；默认为多选multi
                    checkOnly: false,//如果值为true，则只用点击checkbox列才能选中此条记录
                    allowDeselect: true,//如果值true，并且mode值为单选（single）时，可以通过点击checkbox取消对其的选择
                    enableKeyNav: true,
                    listeners:{'beforeselect': function(rowModel, record, index, eOpts) {
                        if(record.data.AuditingState != '待审') return false;
                        else return true;
                    }}
                }),
                columns: [
                    { text: "ID", width: 80, dataIndex: "ID", menuDisabled : true },
                    { text: "甲方", width: 95, dataIndex: "Sender", menuDisabled: true },
                    { text: "乙方", width: 110, dataIndex: "ReceiversList", menuDisabled: true, renderer: function(value, metadata, record, rowIndex, columnIndex, store) {
                        metadata.tdAttr = 'title="'+value+'"';
                        return CountReceiversList(value);
                    }},
                    { text: "时间", width: 120, dataIndex: "InsertTime", menuDisabled: true, renderer: function(value, metadata, record, rowIndex, columnIndex, store) {
                        metadata.tdAttr = 'title="'+value+'"';
                        return value;
                    } },
                    { text: "回执", width: 50, dataIndex: "NeedCallback", menuDisabled: true },
                    { text: "内容", width: 300, dataIndex: "MessageContent", menuDisabled: true, renderer: function(value, metadata, record, rowIndex, columnIndex, store) {
                        metadata.tdAttr = 'title="'+value+'"';//鼠标提示
                        return Ext.util.Format.htmlEncode(value);
                    }},
                    { text: "读取", width: 50, dataIndex: "IsRead", menuDisabled: true },
                    { text: "审核", width: 50, dataIndex: "AuditingState", menuDisabled: true },
                    { text: "审方", width: 70, dataIndex: "Auditor", menuDisabled: true },
                    { text: "审时", width: 120, dataIndex: "AuditingTime", menuDisabled: true, renderer: function(value, metadata, record, rowIndex, columnIndex, store) {
                        metadata.tdAttr = 'title="'+value+'"';
                        return value;
                    } },
                    { text: "说明", width: 150, dataIndex: "AuditingRemark",
                     editor:{xtype:'textfield',allowBlank: false}},//这里是定义为编辑列可以动态修改内容
                    { text: "选择", width: 40, menuDisabled: true }
                ],
                forceFit: true,
                split: true,
                border: true,
                region: 'center',
                emptyText: '<div style="color:red;">无可用数据</div>',
                selType: 'cellmodel',
                plugins: {ptype:'cellediting',clicksToEdit:1}
            });
//数据结构不改变的情况下变更数据源
var handler_RefreshGrid = function(){
                handler_ClearGridInfo();
                store.proxy.url = '/url?p=1';//设置新地址
                store.load();
            }
//批量编辑 grid的可编辑列内容
var handler_EditCol = function(){
                var selectedModel = grid.getSelectionModel();
                var str = '要同步的内容';
                if (selectedModel.hasSelection()) {
                    var rows = selectedModel.getSelection();
                    Ext.each(rows, function (item) {
                        item.set('要编辑的列的id', str);
                    })
                }
            }
//清理grid内容，但是不会清理结构，
var handler_ClearGrid = function(){
                //清除显示的数据
                store.removeAll();
            }

转载于:https://my.oschina.net/raddleoj/blog/357998