Combobox上使用Xtemplate不讓我選擇項目（項目沒有html上的internalId）

Question

我不明白爲什麼使用Xtemplate Combobox中的項目不再可選。我可以在html代碼中看到這些項目沒有更多的internalId。這是我的代碼：

Ext.define('app.widget.search.PredictiveInput', { 
extend: 'Ext.form.field.ComboBox', 
alias: 'widget.predictiveinput', 

store: 'SearchSyntax', 
storeCriteriaSyntax: 'SearchPredictiveInput', 
nodeField: 'is_node', 
leafField: 'is_leaf', 
lastLeafField: 'is_last_leaf', 
levelField: 'level', 
triggerAction: 'all', 
flex: 1, 
queryMode: 'local', 
displayField: 'subject_display', 
valueField: 'id', 
pageSize: 10, 

setCustomTpl: function() { 
var me = this; 
me.tpl = Ext.create('Ext.XTemplate', 
'<tpl for=".">', 
' <div class="x-combo-list-item-isNode-{nodeField}' + 
' x-combo-list-item-isLeaf-{leafField}' + 
' x-combo-list-item-isLastLeaf-{lastLeafField}' + 
' x-combo-list-item-level-{levelField}" role="option">{displayField</div>', 
'</tpl>'   
); 
}, 

initComponent: function() { 
this.callParent(); 
this.setCustomTpl(); 
} 
}); 

Answer 1

我認爲你必須添加類x-boundlist-item。

請參閱comments here。

// Template for the dropdown menu. 
// Note the use of "x-boundlist-item" class, 
// this is required to make the items selectable. 
tpl: Ext.create('Ext.XTemplate', 
    '<tpl for=".">', 
     '<div class="x-boundlist-item">{abbr} - {name}</div>', 
     '</tpl>' 
    ),