Question

我有一个网格面板，显示我数据库中的所有用户。我希望我的网格项（行）可以点击，因为当我点击它们时会发生一些事情，但看起来似乎听众没有。

    Ext.define('PRJ.view.Home', {
     extend: 'Ext.panel.Panel',
     alias: 'widget.home',
     title: 'Home',
     layout: 'fit',

     items: [
        {
            xtype: 'gridpanel',
            store: 'Users',
            title: 'Users grid',
            columns: [
                {text: 'Id', dataIndex: 'id' },
                {text: 'Name', dataIndex: 'name', width : 200 }
            ]
        }
    ]

    });


    Ext.define('PRJ.controller.Menu', {
     extend: 'Ext.app.Controller',

     refs: [
         {
            ref: 'centerPanel',
            selector: '#center-panel'
        }
     ],
     stores: ["Users"
     ],


     init: function() {
         this.control({
             'gridpanel': {
                 itemdblclick: this.editUser
             }
         });
     },

     editUser: function() {
         alert('User double clicked');
     },
});

Answer 1

这可能就像将itemdblclick更改为rowdblclick一样简单。

我创建了一个小提琴here，显示了一种稍微不同的方法（通过在配置中添加侦听器）。代码如下：

Ext.create('Ext.grid.Panel', {
        title: 'Simpsons',
        store: Ext.data.StoreManager.lookup('simpsonsStore'),
        columns: [{
            text: 'Name',
            dataIndex: 'name'
        }, {
            text: 'Email',
            dataIndex: 'email',
            flex: 1
        }, {
            text: 'Phone',
            dataIndex: 'phone'
        }],
        listeners: {
            rowdblclick: function(grid, record, tr, rowIndex, e, eOpts) {
                alert(record.get("name"));
            }
        },
        height: 200,
        width: 400,
        renderTo: Ext.getBody()
    });

您还应该查看Selection Model和Row Editing。

Answer 2

您可以使用单元格编辑插件在单击时使单元格可编辑。在你的网格conf中包含这样的内容：插件：[ Ext.create（＆＃39; Ext.grid.plugin.CellEditing＆＃39;，{ clicksToEdit：1， pluginId：＆＃39; cellEditor＆＃39; }） ]

Answer 3

我发现了问题所在。我得到的答案没有帮助，因为我需要将监听器保留在控制器中，而不是将其移动到视图中。

问题在于我需要将监听器放在home gridpanel上

init: function() {
     this.control({
         'home gridpanel': {
             itemdblclick: this.editUser
         }
     });
 },

现在它就像魅力一样。

Ext JS，项目点击监听器似乎不起作用

3 个答案: