javascript - Extjs 4 cellEditing 插件不适用于多于一个的网格

Question

我有一个包含 2 个或更多网格的简单页面，我想使用 CellEditing 插件来编辑这些网格的单元格。

如果我只有一个网格，一切正常，但如果我制作 2 个(或更多)网格，CellEditing 插件将停止工作。

有人知道如何解决这个问题吗？

我做了一个受此问题影响的最小化示例。

在此示例中，您可以尝试向第一个网格添加一行，然后双击以编辑该网格。如您所见，单元格编辑根本不起作用。 如果您在第二个网格中添加和编辑单元格，它就可以工作。

在这里你可以找到jsfiddle中的例子: http://jsfiddle.net/eternasparta/amHRr/

这是javascript代码:

Ext.require([
    'Ext.form.*',
    'Ext.tip.*']);

var store = Ext.create('Ext.data.Store', {
    fields: ['label'],
    data: []
});
Ext.define('AM.view.editpanel.CustomList', {
    extend: 'Ext.container.Container',
    alias: 'widget.sclist',
    layout: {
        type: 'vbox',
        align: 'stretch'

    },
    items: [{
        xtype: 'grid',
        plugins: [],
        selModel: {
            selType: 'cellmodel'
        },
        tbar: [{
            text: 'Add',
            actionId: 'add',
            handler: function (th, e, eArg) {
                var store = th.up('grid').store;
                var r = Ext.create(store.model.modelName);
                store.insert(0, r);

            }
        }],
        height: 200,
        store: store,
        columns: [{
            text: 'Name',
            dataIndex: 'label',
            flex: 1,
            editor: {
                xtype: 'numberfield',
                allowBlank: false
            }
        }, {
            xtype: 'actioncolumn',
            width: 30,
            sortable: false,

            actionId: 'delete',
            header: 'delete',
            items: [{
                tooltip: 'tool'

            }]
        }],
        flex: 1
    }],
    flex: 1,
    initComponent: function () {
        this.items[0].plugins.push(Ext.create('Ext.grid.plugin.CellEditing', {
            clicksToEdit: 2
        }));


        this.callParent(arguments);

        var sto = Ext.create('Ext.data.Store', {
            fields: ['label'],
            data: []
        });
        this.down('grid').bindStore(sto);
        this.down('grid').columns[0].text = 'Name';
        this.down('grid').columns[0].dataIndex = 'label';
    }
});



Ext.onReady(function () {


    Ext.QuickTips.init();

    var grid1 = Ext.create('AM.view.editpanel.CustomList', {
        renderTo: Ext.getBody()
    });
    var grid2 = Ext.create('AM.view.editpanel.CustomList', {
        renderTo: Ext.getBody()
    });
});

感谢任何帮助，谢谢!

Answer 1

只需在 initComponent 中放置对象或数组类型(在您的情况下为项目)的配置:demo .

有关更多信息，请参阅我的回答 here .