0

Ext JS のグリッドで Excel のような動作をさせる方法を見つけようとしています。

これが私が使用しているサンプルグリッドです。これまでのところ、矢印を使用してセル間を移動できますが、編集モードでのみです。

ただし、私が到達しようとしているのは、Excel のように、編集モードの外で矢印、TAB、および Enter キーを使用したナビゲーションです。

Editor クラスをオーバーライドするこのコードを統合しようとしましたが、セルの動作が変更されることを期待していますが、何も変更されません。

これは、 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