我正在使用这种技术来完成组合框http://cdn.sencha.com/ext-4.1.1a-gpl/examples/form/forum-search.html的自动完成功能,它返回汽车的名称和类型,有时类型是未知的,所以没有任何回报,我希望它是“没有数据“所以我使用了这个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: {
答案 0 :(得分:4)
我猜你正在寻找这种(简化的工作示例。)
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
这是如何运作的
只需为下拉菜单设置模板(如果您的情况下根本需要),并设置显示字段的模板。
这两个例子都是简化的,因为我不知道你的整个模板。
更新了示例
注意:我不会将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 强>
答案 1 :(得分:0)
您可以在列表config 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'
}