Question

你可以告诉别人，当焦点离开时，如何防止在组合框上选择事件吗？

Answer 1

我在extjs 6.5.2 modern中遇到了同样的问题。我使用了combobox queryMode: 'remote'，forceSelection: true，自定义itemTpl，我正在使用select事件选择项目。 @ Jzf的解决方案对我没有用（我也使用change事件）所以我不得不暂停select上的focusleave事件并在focusenter恢复{1}}。

这不是一个非常干净的解决方法，但它完成了我的工作。以下是我的combobox的完整代码：

            {
                xtype: 'combobox',
                store: Ext.create('demo.store.search.SearchComboStore'),
                valueField: 'id',
                displayField: 'name',
                queryMode: 'remote',
                queryParam: 'name',
                triggerAction: 'all',
                allQuery: '',
                minChars: 1,
                forceSelection: true,
                matchFieldWidth: false,
                //[modern] added floated picker config here in order to set the minWidth property for the floated picker
                floatedPicker: {
                    minWidth: (Ext.getBody().getWidth() / 2)
                },
                itemTpl:
                    '<div class="ucResultsTable" style="width:' + (Ext.getBody().getWidth() / 2) + 'px">' +
                        '<div class="ucResultsTableCell" style="width:15%"><b>{value1}</b></div>' +
                        '<div class="ucResultsTableCell" style="width:15%">{value2}</div>' +
                        '<div class="ucResultsTableCell" style="width:15%">{value3}</div>' +
                        '<div class="ucResultsTableCell" style="width:15%">{value4}</div>' +
                        '<div class="ucResultsTableCell" style="width:15%">{value5}</div>' +
                    '</div>',
                listeners: {
                    select: function (comboBox, records, eOpts) {
                        var container = comboBox.up('app-container-panel');
                        container.fireEvent('selectComboItem', container, records.data);
                    },
                    //<Workaround> 
                    //blur/focusleave is firing select event
                    //and changes the record selection
                    focusleave: function (comboBox) {
                        comboBox.suspendEvent('select');
                    },
                    focusenter: function (comboBox) {
                        comboBox.resumeEvent('select');
                    }
                    //</Workaround>
                }
            }

Answer 2

这是一个错误

Correspond theme on Sencha Forum

Answer 3

问题出现是因为组合强制选择，即使用户实际上没有选择其他值。

有几种方法可以解决此问题。

使用不带forceSelection的选择侦听器
将更改侦听器与forceSelection一起使用

两种方式，用户都必须从组合列表中选择一个项目（这可能是您首先使用forceSelection配置的原因）。

Test the workaround in fiddle

组合会在focusleave事件后触发选择事件

3 个答案: