フォーカスが離れるとコンボが選択イベントを発生する

Question

フォーカスを離れるとコンボボックスでイベントが発生するのを防ぐ方法を誰かに教えてください。

Answer 1

です。

この問題を回避するには、いくつかの方法があります。

1. はforceSelection

でどちらの方法を変更リスナーを使用しforceSelectionなし

を選択リスナーを使用して、ユーザーがなぜ、おそらく、である（コンボリストから項目を選択する必要があります最初にforceSelection設定を使用しました）。

Test the workaround in fiddle

Answer 2

このコンボは、ユーザーが実際に別の値を選択していない場合でも、選択を強制するために、問題が発生したバグ

Correspond theme on Sencha Forum

Answer 3

私はextjs 6.5.2 modernで同じ問題がありました。私はcomboboxをqueryMode: 'remote',forceSelection: true、カスタムitemTplと使用していましたが、私はselectイベントを使用して項目を選択していました。 @ Jzfの解決策は私のために働いていませんでした（私はchangeイベントも使用しました）ので、selectイベントをfocusleaveに中断し、focusenterに再開しなければなりませんでした。

これは非常にクリーンな回避策ではありませんが、私の場合の仕事です。 私の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> 
       } 
      }