如何在 Ext Js 中自动选择（显示）组合框的第一个值？

Posted 2023-02-26

【中文标题】如何在 Ext Js 中自动选择（显示）组合框的第一个值？

【英文标题】：How to auto select (show) the first value of combobox in Ext Js?

【发布时间】：2011-07-15 07:11:22

【问题描述】：

这是我的组合框

    xtype: 'combo', 
    fieldLabel: LANG.LOGIN_LANG,
    id : 'lang', 
    store: [
        ['tr','Türkçe'],
        ['ru','Русский'],
        ['en','English']
    ],
    mode: 'local',
    triggerAction: 'all',
    selectOnFocus:true
,

【问题讨论】：

是在创建组合框之前加载存储还是之后加载存储？在给定的示例中，satish kumar 的答案是您的解决方案...

【参考方案1】：

一般情况下，当我想选择一个商店的第一个值时，我使用这种方法：

xtype: 'combo', 
fieldLabel: 'prov',
id : 'lang', 
store:[['tr','Türkçe'],['ru','Русский'],['en','English']],
mode: 'local',
triggerAction: 'all',
selectOnFocus:true,
listeners: 
    afterrender: function(combo) 
        var recordSelected = combo.getStore().getAt(0);                     
        combo.setValue(recordSelected.get('field1'));
    

【参考方案2】：

  xtype: 'combo', 
  fieldLabel: LANG.LOGIN_LANG,
  id : 'lang', 
  store:[['tr','Türkçe'],['ru','Русский'],['en','English']],
  mode: 'local',
  triggerAction: 'all',
  value: 'tr',
  selectOnFocus:true
,

对于远程组合框，您需要插入 store 的 load 事件以在 store 加载后选择值。

【参考方案3】：

你可以像这样使用 value 属性：

value : 'tr'

那么它会默认显示第一个值。

【参考方案4】：

您可以使用此代码，将其 id 之后的任何商店元素分配给默认组合框值。

 
  xtype: 'combobox',
  forceSelection: true,
  allowBlank: true,
  typeAhead: true,
  queryMode: 'local',
  colspan: 3,
  id: 'filter_column_c',
  style: 'margin': '5px 15px 15px 30px',
  fieldLabel: 'Column',
  valueField: 'column',
  displayField: 'name',
  store: nomStores["storeCombo"],
  value: nomStores["storeCombo"].getById(1),
,

【参考方案5】：

作为替代方案，我需要显示一个本地存储的 Store，这只是监听 afterRender 方法的问题：

listeners: 
    afterRender: function() 
        this.select(01);
    

01在这种情况下是Store中元素的id（valueField）：

areasCenters: 
        data: [
                id: 01,
                name: 'Todas'
            ,
            
                id: 02,
                name: 'Elegir...'
            
        ],
        autoLoad: true