0

我正在尝试TAB在我的 dGrid 上导航键。我已将在Dgrid set focus on cell中找到的解决方案用作基础,但是我遇到了一些到目前为止我无法解决的问题。

您可以在下面找到我现在正在使用的块;不是所有的列都有编辑器,所以我添加了一个 var 做元素定义来选择下一列,而不是做一个right. 我还添加了SHIFT+TAB对使向后导航成为可能的支持。MT4.prje.grids[gridId]是 dGrid 实例。页面上可能有各种。

网格是用

MT4.prje.grids[gridId] = new (declare([OnDemandGrid, Keyboard, Selection, CellSelection]))(gridInfo, gridId);

wheregridInfo有列定义和商店。商店创建为:

new Observable(new Memory({'data': {}, 'idProperty': 'id'}));

编辑器通常是TextBoxNumberTextBoxdijitSelect小部件,都设置为 autoSave。

aspect.after(MT4.prje.grids[gridId], "edit", function (promise, cellNode) {
    if (promise === null) return;

    promise.then(function (widget) {
        if (!widget._editorKeypressHandle) {
            widget._editorKeypressHandle = on(widget, "keypress", function (e) {

                for (var rowId in MT4.prje.grids[gridId].selection) {
                    break;
                }
                for (var columnId in MT4.prje.grids[gridId].selection[rowId]) {
                    break;
                }

                if (e.charOrCode == keys.TAB) {
                    e.preventDefault();

                    var cellToEdit = null,
                        cellEdited = MT4.prje.grids[gridId].cell(rowId, columnId);

                    if (e.shiftKey) {
                        if (cellEdited.column.previousEditor === undefined) {
                            rowId = parseInt(rowId) - 1;
                            if (MT4.prje.grids[gridId].row(rowId).element !== null) {
                                for (var lastColumnId in MT4.prje.grids[gridId].columns) {}
                                cellToEdit = MT4.prje.grids[gridId].cell(rowId, lastColumnId);
                            }
                        } else {
                            cellToEdit = MT4.prje.grids[gridId].cell(rowId, cellEdited.column.previousEditor);
                        }
                    } else {
                        if (cellEdited.column.nextEditor === undefined) {
                            var firstColumnId = null;
                            rowId = parseInt(rowId) + 1;
                            if (MT4.prje.grids[gridId].row(rowId).element === null) {
                                var fields = {};
                                for (var cId in MT4.prje.grids[gridId].columns) {
                                    if ((cId != 'excluir') && (firstColumnId === null)) {
                                        firstColumnId = cId;
                                    }
                                    fields[cId] = '';
                                }
                                MT4.prje.addRowToGrid(gridId, fields);
                            } else {
                                for (var cId in MT4.prje.grids[gridId].columns) {
                                    if (cId != 'excluir') {
                                        firstColumnId = cId;
                                        break;
                                    }
                                }
                            }

                            cellToEdit = MT4.prje.grids[gridId].cell(rowId, firstColumnId);
                        } else {
                            cellToEdit = MT4.prje.grids[gridId].cell(rowId, cellEdited.column.nextEditor);
                        }
                    }

                    if (cellToEdit) {
                        MT4.prje.grids[gridId].deselect(cellEdited);
                        MT4.prje.grids[gridId].select(cellToEdit);
                        MT4.prje.grids[gridId].edit(cellToEdit);

                    }
                }
            });
        }
    });
});

即使忽略新行部分,也会发生一些错误。首先,编辑器几乎不存在,它们与选择一起消失。有时,当切换到空列时,编辑器将填充上一个编辑器的值。有没有办法更一致地做到这一点?

我在想的是 sharedEditor 上发生了竞争条件(它们设置为editOn: focus)。我尝试将取消选择/选择包装在 dojo.on('blur') 上并发出它。但是,小部件并不能始终如一地正确dijit/form/Select。有更好的活动我可以呼吁吗?

我还尝试将最后一个块更改为:

if (cellToEdit) {
    on(cellToEdit.element, 'focus', function(){
        MT4.prje.grids[gridId].select(cellToEdit);
    });

    on(cellEdited.element, 'blur', function(){
        MT4.prje.grids[gridId].deselect(cellEdited);
        on.emit(cellToEdit.element, 'focus', {'bubble': true, 'cancelable': false});
    });

    on.emit(cellEdited.element, 'blur', {'bubble': true, 'cancelable': false});
}

但这给出了两个错误:

  1. 如果我确实对单元格进行了更改,它不会转到下一个编辑器。甚至不选择它。
  2. 我第一次从一个空单元格移动到另一个空单元格时,它也不起作用。

有人有什么想法吗?

4

1 回答 1

0

此修复适用于 dgrid 0.3.11。

添加到您的 dgrid 的 postCreate。

postCreate: function() {
    var that = this;
    this.inherited(arguments);

    this.on('dgrid-datachange', function(evt) {
        that._selectedCell = that.cell(evt);
    });

    aspect.after(this, 'save', function(dfd) {
        dfd.then(function() {
            var nextCell = that.right(that.cell(that._selectedCell.row.id, that._selectedCell.column.id));
            that.edit(nextCell);
            // Bonus Fix. Workaround dgrid bug that blocks field text to be selected on focus.
            nextCell.element.widget && nextCell.element.widget.textbox && nextCell.element.widget.textbox.select();
        });
    });
}
于 2013-10-26T13:18:58.543 回答