EXTJS 4 - 如何在通过网格使用Tab键时跳过单个单元格,但保持选项卡按下开始编辑下一个可编辑单元格?

时间:2014-01-16 12:34:05

标签: extjs grid extjs4 tablecelleditor

我有一个网格,有单元格编辑和行选择模型。我使用tab转到下一个单元格并开始编辑它,但是有些单元格我需要跳过编辑,但是当按下标签时需要转到下一个可编辑单元格。

如果我只是从“beforeedit”事件中“返回false”,它会取消整个编辑过程,所以我需要再次使用鼠标,这是错误的。

我如何跳过细胞但保持标签工作?

        plugins: [
            Ext.create('Ext.grid.plugin.CellEditing', {
                clicksToEdit: 1,
                listeners: {
                    beforeedit: {
                        fn: me.onCellEditingBeforeEdit,
                        scope: me
                    }
                }
            })
        ]

这是编辑前的功能:

onCellEditingBeforeEdit: function(editor, e, eOpts) {

    var isEditable=this.isCellEditabe(editor, e); // return false if the cell is not editable

    if (!isEditable)
    {
        return false;
    }

}

2 个答案:

答案 0 :(得分:0)

我在.net论坛的某个地方找到了解决方案:

Ext.selection.RowModel.override({
        onEditorTab: function(editingPlugin, e) {
           var me = this,
            view = me.views[0],
            record = editingPlugin.getActiveRecord(),
            header = editingPlugin.getActiveColumn(),
            position = view.getPosition(record, header),
            direction = e.shiftKey ? 'left' : 'right',
            columnHeader;

        // We want to continue looping while:
        // 1) We have a valid position
        // 2) There is no editor at that position
        // 3) There is an editor, but editing has been cancelled (veto event)

        do {
            position  = view.walkCells(position, direction, e, me.preventWrap);
            columnHeader = view.headerCt.items.getAt(position.column);
        } while (position && (!columnHeader.getEditor(record) || !editingPlugin.startEditByPosition(position)));
    }    
});

答案 1 :(得分:0)

在当前网格中将其用作配置:

var grid = Ext.create('Ext.grid.Panel', {
    ...
    selModel: Ext.create('selection.cellmodel', {
        onEditorTab: function(editingPlugin, e) {
            var me = this,
                direction = e.shiftKey ? 'left' : 'right',
                position  = me.move(direction, e);

            if (position) {
                while(!editingPlugin.startEdit(position.row, position.column)){
                    position = me.move(direction, e);

                    // go to first editable cell
                    if(!position) editingPlugin.startEdit(0, 1); // TODO: make this dynamic
                }
                me.wasEditing = false;

            } else {
                // go to first editable cell
                if (editingPlugin.startEdit(0, 1)) { // TODO: make this dynamic
                    me.wasEditing = false;
                }
            }
        },
    }),
    //selType: 'cellmodel', // remove selType
    ...
})