多语言展示
当前在线:1231今日阅读:168今日分享:49

ExtJs使得某一列不能编辑

ExtJs使得某一列不能编辑,这个地方是用于项目中权限的核定和选择的。
工具/原料
1

notepad++

2

extjs3.4

方法/步骤
1

导入js包

2

构建列模型 var cm = new Ext.grid.ColumnModel([{ id:'id',        header: '编号',        dataIndex: 'id',        editor: new Ext.grid.GridEditor(            new Ext.form.TextField({                allowBlank: false            })        )    }, { id:'name',        header: '名称',        dataIndex: 'name',        editor: new Ext.grid.GridEditor(            new Ext.form.TextField({                allowBlank: false            })        )    }, {id:'descn',        header: '描述',        dataIndex: 'descn',        editor: new Ext.grid.GridEditor(            new Ext.form.TextField({                allowBlank: false            })        )    }]);

3

数据 var data = [        ['1','name1','descn1'],        ['2','name2','descn2'],        ['3','name3','descn3'],        ['4','name4','descn4'],        ['5','name5','descn5']    ];

4

数据集构建获取 var store = new Ext.data.Store({        proxy: new Ext.data.MemoryProxy(data),        reader: new Ext.data.ArrayReader({}, [            {name: 'id'},            {name: 'name'},            {name: 'descn'}        ]),        pruneModifiedRecords: true    });

5

var Record = Ext.data.Record.create([        {name: 'id', type: 'string'},        {name: 'name', type: 'string'},        {name: 'descn', type: 'string'}    ]);    store.load();

6

可以编辑的gridvar grid = new Ext.grid.EditorGridPanel({        autoHeight: true,        renderTo: 'grid',        store: store,        cm: cm,        tbar: new Ext.Toolbar(['-', {            text: '添加一行',            handler: function(){                var initValue = {id:'',name:'',descn:''};                var p = new Record(initValue);                grid.stopEditing();                store.insert(0, p);                grid.startEditing(0, 0);                p.dirty = true;                p.modified = initValue;                if(store.modified.indexOf(p) == -1){                    store.modified.push(p);                }            }        }, '-', {            text: '删除一行',            handler: function(){                Ext.Msg.confirm('信息', '确定要删除?', function(btn){                    if (btn == 'yes') {                        var sm = grid.getSelectionModel();                        var cell = sm.getSelectedCell();                        var record = store.getAt(cell[0]);                        store.remove(record);                    }                });            }        }, '-', {            text: '保存',            handler: function(){                var m = store.modified.slice(0);                var jsonArray = [];                Ext.each(m, function(item) {                    jsonArray.push(item.data);                });                Ext.lib.Ajax.request(                    'POST',                    '11_03_01.jsp',                    {success: function(response){                        Ext.Msg.alert('信息', response.responseText, function(){                            //store.reload();                        });                    },failure: function(){                        Ext.Msg.alert('错误', '与后台联系的时候出现了问题');                    }},                    'data=' + encodeURIComponent(Ext.encode(jsonArray)) ///传递到jsp 的参数                );            }        }, '-'])    });

7

不可编辑的列的选择

注意事项

觉得有用请好评a !

推荐信息