Ext之grid內編輯

Ext.grid.Panel xtype:gridpanel,grid

如果要完成在grid中編輯的功能.首先要填加

selType: ‘cellmodel‘,
    plugins: [
        Ext.create(‘Ext.grid.plugin.CellEditing‘, {
            clicksToEdit: 1
        })
    ],這個是實現單個點擊直接編輯

或者加上

selType: ‘rowmodel‘,
    plugins: [
        Ext.create(‘Ext.grid.plugin.RowEditing‘, {
            clicksToEdit: 1
        })
    ],這個是實現點擊會彈框提示是否修改

對於要編輯的位置可以加上

egg:當然也可以添加其他的功能 改行數據為 name

editor: {
                xtype: ‘textfield‘,
                allowBlank: false
            }

那麼原來的grid就有了編輯的功能.

雖然數據才列表中顯示發生了變化但是,數據庫中的這些數據並沒有發生實質上的變化.

解決方法一,可以往eidtor裏面添加一個change監聽器.來監聽事件.當改變時可以通過一個ajax來完成數據更改.

解決方法二,可以直接把監聽器放到grid裏面,為其添加edit事件, edit: function (editor, e) {

如果e.field等於‘name’ //判斷編輯的是不是該行

• grid - 当前grid
• record - 当前编辑行的数据
• field - 要编辑的字段名
• value - 编辑后的值
• originalValue - 原先的值.
• row - 行数
• column - 要编辑的列模型 Column
• rowIdx - 行索引
• colIdx - 列索引