ExtJS 4.1 Jak zaznaczyć pierwszy element w combo

Question

mam kombi wyglądać http://jsfiddle.net/Q5nNV/

wszystko jest dobrze, ale kiedy wyszukiwania (pisanie na maszynie) jakiś tekst jak asdf do pola kombi i kliknij jasne przycisk

to nie wybrać pierwszą pozycję, to wygląda

Oto mój kod

var states = Ext.create('Ext.data.Store', { 
    fields: ['abbr', 'name'], 
    data : [ 
     {"abbr":"AK", "name":""}, 
     {"abbr":"AL", "name":"Alabama"}, 
     {"abbr":"AZ", "name":"Arizona"} 
    ] 
}); 

// Create the combo box, attached to the states data store 
var combo = Ext.create('Ext.form.ComboBox', { 
    fieldLabel: 'Choose State', 
    store: states, 
    triggerAction: 'all', 
    value: "AK", 
    queryMode: 'local', 
    displayField: 'name', 
    valueField: 'abbr', 
    trigger2Cls: 'x-form-clear-trigger', 
    onTrigger2Click: function (args) { 
     this.setValue("AK"); 
    }, 
    tpl: new Ext.XTemplate('<tpl for=".">' + '<li style="height:22px;" class="x-boundlist-item" role="option">' + '{name}' + '</li></tpl>'), 
    renderTo: Ext.getBody() 
}); 

Chcę po kliknięciu przycisku wyraźnego mój combo wybrać pierwszą pozycję (pusty element). Jak to naprawić, dziękuję

Answer 1

To powinno wystarczyć. Zasadniczo należy wybrać pierwszą wartość, sprawiają, że ponowne zapytanie tak, że można go wyczyścić filtr i następnie wysłać skupić się z powrotem do pola (opcjonalnie):

Ext.onReady(function() { 
    // The data store containing the list of states 
    var states = Ext.create('Ext.data.Store', { 
     fields: ['abbr', 'name'], 
     data : [ 
      {"abbr":"AK", "name":""}, 
      {"abbr":"AL", "name":"Alabama"}, 
      {"abbr":"AZ", "name":"Arizona"} 
     ] 
    }); 

    // Create the combo box, attached to the states data store 
    var combo = Ext.create('Ext.form.ComboBox', { 
     fieldLabel: 'Choose State', 
     store: states, 
     triggerAction: 'all', 
     queryMode: 'local', 
     displayField: 'name', 
     valueField: 'abbr', 
     trigger2Cls: 'x-form-clear-trigger', 
     enableKeyEvents: true, 
     onTrigger2Click: function (args) { 
      // Select the first record in the store 
      this.select(this.getStore().getAt(0)); 
      // Force a re-query to clear the filter 
      this.doQuery(); 
      // Send focus back to the field 
      this.focus(); 
     }, 
     tpl: new Ext.XTemplate('<tpl for=".">' + '<li style="height:22px;" class="x-boundlist-item" role="option">' + '{name}' + '</li></tpl>'), 
     renderTo: Ext.getBody() 
    }); 
}); 

Oczywiście ponowne zapytanie i ostrość są opcjonalne . Możesz łatwo usunąć je z tego kodu.

Alternatywnie można użyć this.select(this.getStore().getAt(0));, a następnie wykonać this.blur(), aby go wybrać, a następnie natychmiast pozbyć się niezapełnionej listy.

Answer 2

to działa na mnie

var combo = Ext.getCmp('myId'); 
combo.select(combo.getStore().getAt(0)); 

Answer 3

to jest praca dla mnie ....

 var cmbESTADO = component.query('#cmbESTADO')[0]; 
     cmbESTADO.store.load(function(st){ 
      cmbESTADO.select(cmbESTADO.getStore().getAt(0)); 
     }); 

gdy combobox nie ładować, select nie działać. Przed załadowaniem, a następnie wybierz.