1

你好，我有以下我使用的 RowEditing 插件

ar rowEditing = Ext.create('Ext.grid.plugin.RowEditing', {
clicksToMoveEditor: 1,
autoCancel: false,
errorSummary:false,
onEnterKey: function(e) { console.log(e); },
listeners:{
    'beforeedit':function(grid,eOpts){
    },
    'canceledit':function(grid, eOpts){
        if(grid.grid.store.data.getAt(0).data.id == "new"){
            grid.grid.store.removeAt(0);
        }
    },
    'afteredit':function(editor, changes, record, rowIndex){
        editor.grid.store.reload();
    },
    'validateedit': handleUpdate{{params.alias}}
}
});

但是仍然执行输入操作并且没有执行控制台日志......我也尝试将它放在侦听器中但没有改变......

这是我网格中的项目

  {
        header: 'Description',
        width: 160, 
        align: 'left',
        dataIndex: 'description',
                        filters: {
                type: 'string'
            },
            enableKeyEvents: true,
                            editor: {
                xtype: 'textfield',
                allowBlank: false,
                listeners: {
                    keydown:    {
                        element: 'el',
                        fn: function(el){ 
                            if (el.ENTER){
                                alert('test');
                                return false;
                            }
                        }
                    },
        },
            }
    }

所以我的下一个尝试是“禁用”在字段本身内触发输入（或提交 rowedit）。但是 return false 仍然提交表单，并且 onEnterKey 在那里也不起作用......有人知道我做错了什么吗？

我确实发现 onEnterKey 是父 Editing 类的一部分，但它没有说明我应该如何称呼它..

4

1 回答 1

3

首先，onEnterKey被标记为私有的，所以你不应该覆盖它，尤其是在实例化时。如果你想重写类方法，你应该通过创建一个继承自包含方法的类的新类来实现：

Ext.define('My.grid.plugin.Editing', {
    extends: 'Ext.grid.plugin.RowEditing',

    onEnterKey: function() {
        this.callParent(arguments);            

        // your code here
    }
});

关于您的问题，我建议采用以下方法之一：

A)如果您真的只想禁用 ENTER 键事件，您应该在编辑器字段中执行此操作。您的尝试很接近，但事件侦听器还没有做正确的事情：

editor: {
    allowBlank: false,
    listeners: {
        keydown: function(e){ 
            if (e.getKey() == e.ENTER){
                e.stopEvent();
            }
        }
    }
}

请注意，使用这种方法，用户仍然可以通过单击行编辑插件的“更新”按钮来提交任何更改。

B）如果你只是想阻止编辑插件在某些条件下将更改写入存储，你也可以在编辑插件上使用validateedit事件：

listeners: {
    validateedit: function(editor, e) {
        if (true) { // your condition here
            return false;
        }
    }
}

如果用户单击“更新”按钮，这也将起作用。

于 2013-10-14T11:08:37.167 回答