0

我试图找出一种方法,让 Ext JS 上的网格具有类似 Excel 的行为。

是我正在使用的示例网格。到目前为止,我们已经可以使用箭头导航单元格,但只能在编辑模式下。

但是我想要达到的是在编辑模式之外使用箭头、TAB 和 Enter 键进行导航,就像 excel 一样。

我试图集成这段覆盖编辑器类的代码,希望它会改变单元格的行为,但它不会改变任何事情。

我相信这是覆盖 Editor 类并尝试包含键输入的最重要部分:

Ext.override(Ext.Editor, {
startEdit: function (el, value) {
    var me = this,
        field = me.field;

    me.completeEdit();
    me.boundEl = Ext.get(el);
    value = Ext.isDefined(value) ? value : me.boundEl.dom.innerHTML;

    if (!me.rendered) {
        me.render(me.parentEl || document.body);
    }

    if (me.fireEvent('beforestartedit', me, me.boundEl, value) !== false) {
        me.startValue = value;
        me.show();
        field.reset();

        if (deleteGridCellValue) {
            field.setValue('');
            me.editing = true;
            me.completeEdit();
            deleteGridCellValue = false; // reset global variable
        }
        else {
            if (newGridCellValue == '') {
                // default behaviour of Ext.Editor (see source if needed)
                field.setValue(value);
            }
            else {
                // custom behaviour to handle an alphanumeric key press from non-edit mode
                field.setRawValue(newGridCellValue);
                newGridCellValue = ''; // reset global variable

                if (field instanceof Ext.form.field.ComboBox) {
                    // force the combo box's filtered dropdown list to be displayed (some browsers need this)
                    field.doQueryTask.delay(field.queryDelay);
                }
            }

            me.realign(true);
            field.focus(false, 10);
            if (field.autoSize) {
                field.autoSize();
            }
            me.editing = true;
        }
    }
}
});

这是我第一次从事 Comp-Sci 课程之外的项目,因此非常感谢任何帮助。谢谢 !

4

0 回答 0