ExtJs

Question

我有一个包含组合框的网格列作为其编辑器，我正在使用 celleditor 插件，我想在其中编写一些验证逻辑。当我尝试 select 组合框单元格中的某些内容时，预计它会在值更改后失去焦点，然后它应该转到 validateedit 侦听器。我知道组合框上有一个 blur() 方法可以解决这个问题。但是根据 document，这是一个私有方法，所以我避免了。我想知道是否有另一种方法可以让我们不再关注更改或选择器折叠或任何将对字段更改执行验证的配置。下面是代码和 fiddle.

Ext.application({
    name: 'Fiddle',

    launch: function () {
        Ext.create('Ext.data.Store', {
            storeId: 'simpsonsStore',
            fields: ['name', 'email', 'phone'],
            data: [{
                name: 'Lisa',
                email: 'lisa@simpsons.com',
                phone: '555-111-1224'
            }, {
                name: 'Bart',
                email: 'bart@simpsons.com',
                phone: '555-222-1234'
            }, {
                name: 'Homer',
                email: 'homer@simpsons.com',
                phone: '555-222-1244'
            }, {
                name: 'Marge',
                email: 'marge@simpsons.com',
                phone: '555-222-1254'
            }]
        });

        Ext.create('Ext.grid.Panel', {
            title: 'Simpsons',
            store: Ext.data.StoreManager.lookup('simpsonsStore'),
            columns: [{
                header: 'Email',
                dataIndex: 'email',
                flex: 1,
                getEditor: function () {
                    return {
                        validateOnChange: false,
                        validateOnBlur: false,
                        xtype: 'combobox',
                        allowBlank: false,
                        displayField: "name",
                        listeners: {
                            blur: function () {
                                console.log("blurred");
                            },
                            change: function () {
                                console.log('change');
                                // this.blur();
                            }
                        },
                        store: {
                            data: [{
                                name: "A"
                            }, {
                                name: "B"
                            }, {
                                name: "C"
                            }, {
                                name: "D"
                            }]
                        }
                    }
                }
            }],
            selModel: 'cellmodel',
            plugins: {
                cellediting: {
                    clicksToEdit: 1,
                    listeners: {
                        validateedit: function () {
                            console.log("validated")
                        }
                    }
                }
            },
            height: 200,
            width: 400,
            renderTo: Ext.getBody()
        });
    }
});

Answer 1

您可以尝试使用 completeEdit 方法作为替代方法：

listeners: {
    blur: function () {
        console.log("blurred");
    },
    change: function () {
        console.log('change');
        this.up('grid').getPlugin().completeEdit();
    }
},

ExtJs - 从网格列编辑器中删除组合框焦点

ExtJs - Remove combobox focus from grid columns editor

extjs6