Extjs Combo diplay value - 如果未找到值

Question

我正在使用此技術來完成組合框的自動完成功能http://cdn.sencha.com/ext-4.1.1a-gpl/examples/form/forum-search.html，它返回汽車的名稱和類型，有時該類型未知，因此無法返回，I想它是「無數據」，所以我用這個valueNotFoundText: 'No Data'但沒有奏效

xtype: 'combo', 
store: s, 
hideTrigger:true, 
typeAhead: false, 
id: 'search', 
queryMode: 'remote', 
queryParam: 'query', 
displayField: 'name',//+'type', 
valueField: 'name',//+'type', 
//valueNotFoundText: 'No Data', 
,listConfig: { 
       loadingText: ' Loading...', 
       getInnerTpl: function() { 
     return '{name}'+'<br>'+'<p><font size="1">{type}'+':type</font></p>'; 
       } 
       , 
      } 
      , listeners: { 

Answer 1

我猜你正在尋找排序的這個（簡化的工作的例子。）

Ext.create('Ext.form.ComboBox', { 
    fieldLabel: 'Choose State', 
    store: states, 
    typeAhead: true, // this will simply show the typed text if nothing is found. 
    queryMode: 'local', 
    displayField: 'name', 
    valueField: 'abbr', 
    tpl: Ext.create('Ext.XTemplate', 
     '<tpl for=".">', 
       '<div class="x-boundlist-item">{abbr}</div>', 
     '</tpl>' 
    ), 
    displayTpl: Ext.create('Ext.XTemplate', 
     '<tpl for=".">', 
      '<tpl if="name.length == 0"> ',    
       'no data', // You can return any other additional value or formating here 
      '<tpl else>', 
       '{name}', // You can return any other additional value or formating here 
      '</tpl>',         
     '</tpl>' 
    ), 
    valueNotFoundText: 'no data' // this will be displayed if no record is found after setValue() 
}); 

這裏的工作JSFiddle

那麼，如何做到這一點的工作

只需爲下拉菜單m設置模板enu（如果這種情況在您的情況下完全需要）併爲顯示字段設置模板。

這兩個例子都簡化了，因爲我不知道你的整個模板。

更新實例

注：我不會用type作爲屬性名稱原因這是排序保留名稱的，導致它標識字段對象/類型原語

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

// Create the combo box, attached to the states data store 
Ext.create('Ext.form.ComboBox', { 
    fieldLabel: 'Choose State', 
    store: states, 
    typeAhead: true, // this will simply show the typed text if nothing is found. 
    queryMode: 'local', 
    displayField: 'name', 
    valueField: 'abbr', 
    tpl: Ext.create('Ext.XTemplate', 
     '<tpl for=".">', 
      '<tpl if="ctype.length == 0"> ',    
       '<div class="x-boundlist-item">{name}<p><font size="1">no data</font></p></div>', 
      '<tpl else>', 
       '<div class="x-boundlist-item">{name}{ctype}<p><font size="1">{ctype}</font></p></div>', 
      '</tpl>', 
     '</tpl>' 
    ), 
    displayTpl: Ext.create('Ext.XTemplate', 
     '<tpl for=".">', 
      '<tpl if="itype.length == 0"> ',    
       'no data', 
      '<tpl else>', 
       '{name}', 
      '</tpl>',         
     '</tpl>' 
    ), 
    valueNotFoundText: 'no data', // this will be displayed if no record is found after setValue() 
    renderTo: Ext.getBody() 
}); 

JSFiddle

Answer 2

您可以在列表配置http://docs.sencha.com/ext-js/4-1/#!/api/Ext.view.AbstractView-cfg-emptyText使用emptyText配置選項上。 ComboBoxes內部列表類BoundList從View擴展，因此它遵循相同的api。 http://docs.sencha.com/ext-js/4-1/#!/api/Ext.form.field.ComboBox-cfg-listConfig

listConfig: { 
    emptyText: 'No Data' 
}