Question

您好我有以下使用

的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）。但是返回false仍然提交表单，并且onEnterKey也不在那里工作......任何人都知道我做错了什么？

我确实发现onEnterKey是父编辑类的一部分，但它没有说我应该如何调用它..

Answer 1

首先，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;
        }
    }
}

如果用户点击“更新”按钮，这也可以。

extjs onKeyEnter没有触发

1 个答案: