ExtJs网格列编辑器combobox不使用私有blur方法实现失焦触发validateedit

你可以使用ExtJS公开的官方API实现需求，不需要调用私有blur()方法，两种常用合规实现方式如下： #

方案1：主动结束单元格编辑（推荐） #

你要触发validateedit的本质是要结束当前单元格的编辑状态，直接调用cellediting插件的公开方法completeEdit()即可，这个方法会自动执行编辑器失焦、校验、提交值的全流程，完全符合你的需求。
修改combobox的select/change事件监听代码即可：

listeners: {
    blur: function () {
        console.log("blurred");
    },
    // 用select事件更贴合下拉选择的场景，也可以保留change事件
    select: function(combo) {
        console.log('选择完成');
        // 获取当前grid的cellediting插件实例，调用完成编辑方法
        const cellEditing = combo.up('grid').getPlugin('cellediting');
        cellEditing.completeEdit();
    }
}

注意要给cellediting插件加个id方便获取实例，修改插件配置：

plugins: {
    cellediting: {
        id: 'cellediting', // 新增id配置
        clicksToEdit: 1,
        listeners: {
            validateedit: function () {
                console.log("validated")
            }
        }
    }
}

方案2：仅主动触发校验不需要结束编辑 #

如果你不需要结束编辑状态，只是要值变化时立刻执行校验逻辑，也可以直接调用编辑器的validate()方法，或者手动触发validateedit事件：

change: function(combo, newValue) {
    console.log('值变更');
    // 直接执行字段校验
    const isValid = combo.validate();
    // 也可以手动触发validateedit事件
    const cellEditing = combo.up('grid').getPlugin('cellediting');
    const context = cellEditing.getContext();
    cellEditing.fireEvent('validateedit', cellEditing, context);
}

完整可运行代码（修改后） #

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");
                            },
                            select: function(combo) {
                                console.log('选择完成');
                                const cellEditing = combo.up('grid').getPlugin('cellediting');
                                cellEditing.completeEdit();
                            }
                        },
                        store: {
                            data: [{
                                name: "A"
                            }, {
                                name: "B"
                            }, {
                                name: "C"
                            }, {
                                name: "D"
                            }]
                        }
                    }
                }
            }],
            selModel: 'cellmodel',
            plugins: {
                cellediting: {
                    id: 'cellediting',
                    clicksToEdit: 1,
                    listeners: {
                        validateedit: function () {
                            console.log("validated")
                        }
                    }
                }
            },
            height: 200,
            width: 400,
            renderTo: Ext.getBody()
        });
    }
});

内容的提问来源于stack exchange，提问作者wahab memon