ExtJS 4.1 Làm thế nào để chọn mục đầu tiên trong combo

Question

Tôi có một combo trông giống như http://jsfiddle.net/Q5nNV/

mọi thứ đều tốt nhưng khi tôi tìm kiếm (đánh máy) một số văn bản như asdf để combo box và nhấn rõ ràng nút

đó là không chọn mục đầu tiên, nó trông giống như

Đây là mã của tôi

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() 
}); 

tôi muốn khi tôi bấm nút rõ ràng combo của tôi sẽ chọn mục đầu tiên (trống mục). Cách khắc phục điều đó cảm ơn

Answer 1

Điều này sẽ thực hiện thủ thuật. Về cơ bản bạn cần phải chọn giá trị đầu tiên, làm cho nó tái truy vấn để nó có thể xóa bộ lọc và sau đó gửi tập trung trở lại với lĩnh vực này (không bắt buộc):

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() 
    }); 
}); 

Rõ ràng, việc tái truy vấn và tập trung là không bắt buộc . Bạn có thể dễ dàng xóa chúng khỏi mã này.

Cách khác, bạn có thể sử dụng this.select(this.getStore().getAt(0)); và sau đó thực hiện this.blur() để chọn nó và sau đó ngay lập tức thoát khỏi danh sách không được phổ biến.

Answer 2

này làm việc cho tôi

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

Answer 3

đây là công việc cho tôi ....

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

khi combobox không tải, sau đó chọn không làm việc. Trước khi tải và sau đó chọn.