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

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 一样简单。

我创建了一个 fiddle 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 and Row Editing。

Answer 2

您可以使用单元格编辑插件使单元格在单击时可编辑。在您的网格 conf 中包含类似这样的内容：插件：[ Ext.create('Ext.grid.plugin.CellEditing', { 点击编辑：1， pluginId: 'cellEditor' }) ]

Answer 3

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

问题是我需要像

一样将监听器放在 home gridpanel 上

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

现在它很有魅力。

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

Ext JS, item click listener does't seem to work

javascript

extjs