2017-11-22 8 views
0
    xtype  : 'combo', 
        allowBlank : false, 
        hideTrigger : true, 
        name  : 'dummyName', 
        itemId  : 'value', 
        fieldLabel : 'Value', 
        labelWidth: 40, 
        store  : { 
         fields : ['value'], 
         proxy : { 
          type: 'ajax', 
          url: '/DUMMY/URL/', 
          reader: { 
           type: 'json', 
           rootProperty: 'results' 
          } 
         } 
        }, 
        displayField: 'value', 
        valueField : 'value', 
        queryMode : 'remote', 
        queryParam : 'search', 
        typeAhead : false, 
        minChars : 0,  
        queryDelay : 500, 
        emptyText : 'mandatory', 
        msgTarget : 'none', 
        listConfig : { 
         maxHeight : 220 
        }, 

これにより、AJAX呼び出しが送信され、最初の文字を入力する際の提案が表示されます。しかし、私は、コンボが集中しているとき、そしてタイピングが始まる前でさえ、提案を表示したい。入力時ではなくComboBoxのonFocusを送信する

「フォーカス」リスナーを使用してAJAXコールを送信できます。ただし、提案は表示されません。

    listeners:{ 
         'focus': function(){ 
           this.store.load(); 
          } 
        } 

答えて

1

ピッカーが作成されているかどうかを確認できます。作成された場合は、それ以外の場合はトリガー機能を起動します。ここで

は一例です:

Ext.application({ 
    name: 'Fiddle', 

    launch: function() { 

     var states = Ext.create('Ext.data.Store', { 
      fields: ['abbr', 'name'], 
      proxy: { 
       type: 'ajax', 
       url: 'data.json', 
       reader: { 
        type: 'json' 
       } 
      }, 
      autoLoad: true 
     }); 

     Ext.create('Ext.panel.Panel', { 
      renderTo: Ext.getBody(), 
      title: 'combo example', 
      layout: 'fit', 
      items: [{ 
       xtype: 'combobox', 
       fieldLabel: 'Choose State', 
       store: states, 
       queryMode: 'local', 
       displayField: 'name', 
       valueField: 'abbr', 
       listeners: { 
        focus: function (component) { 
         component.store.load(function() { 
          if (Ext.isEmpty(component.picker)) { 
           component.onTriggerClick(); 
          } else { 
           component.picker.show(); 
          } 
         }); 

        } 
       } 
      }] 
     }); 
    } 
}); 

例フィドル:https://fiddle.sencha.com/#view/editor&fiddle/2a04

関連する問題