1
У меня есть ComboBox с довольно простой конфигурацией, как вы можете видеть в this fiddle.ComboBox не отображает выбранное значение
Проблема заключается в том, что когда я выбираю значение в раскрывающемся списке, оно не отображается в текстовом поле комбо, и я не могу понять, почему.
Кроме того, я установил свойство hideTrigger в true, но триггер комбинации все еще отображается.
Вот код скрипку, если вы не можете получить доступ к нему:
Ext.define('MyApp.LanguageCombo', {
extend: 'Ext.form.field.ComboBox',
alias: 'widget.myapp.LanguageCombo',
initComponent: function() {
Ext.apply(this, this.factory());
this.callParent();
},
factory: function() {
return {
store: Ext.create('Ext.data.JsonStore', {
proxy: {
type: 'memory',
},
fields: ['id', 'name'],
data: [{"name":"afar","id":"aar"},{"name":"austro-asiatiques, langues","id":"aav"},{"name":"abkhaze","id":"abk"},{"name":"aceh","id":"ace"},{"name":"acolo (syn : acoli, gang)","id":"ach"},{"name":"adangbme (syn : adan, adagbe, adame)","id":"ada"},{"name":"adygh\u00e9","id":"ady"},{"name":"afro-asiatiques, langues","id":"afa"},{"name":"afrihili","id":"afh"},{"name":"afrikaans","id":"afr"},{"name":"a\u00efnou","id":"ain"},{"name":"aljamia (syn : aljamiada)","id":"ajm"},{"name":"akan (syn : twi)","id":"aka"},{"name":"akkadien","id":"akk"},{"name":"albanais","id":"alb"},{"name":"al\u00e9oute (syn : al\u00e9out, aleut)","id":"ale"},{"name":"algonquines, langues","id":"alg"},{"name":"altai du Sud","id":"alt"},{"name":"atlantique-congo, langues","id":"alv"},{"name":"amharique","id":"amh"},{"name":"anglo-saxon (ca.450-1100)","id":"ang"},{"name":"angika","id":"anp"},{"name":"apaches, langues","id":"apa"},{"name":"alacalufanes, langues","id":"aqa"},{"name":"algiques, langues","id":"aql"},{"name":"arabe","id":"ara"},{"name":"aram\u00e9en d'empire (700-300 BCE)","id":"arc"},{"name":"aragonais","id":"arg"},{"name":"arm\u00e9nien","id":"arm"},{"name":"mapudungun (syn : mapuche, mapuce)","id":"arn"},{"name":"arapaho","id":"arp"},{"name":"artificielles, langues","id":"art"},{"name":"arawak","id":"arw"},{"name":"assamais","id":"asm"},{"name":"asturien (syn : bable, l\u00e9onais, asturol\u00e9onais)","id":"ast"},{"name":"athapascanes, langues","id":"ath"},{"name":"arauanes, langues","id":"auf"},{"name":"australiennes, langues","id":"aus"},{"name":"avar","id":"ava"},{"name":"avestique (syn : ancien, zend)","id":"ave"},{"name":"awadhi","id":"awa"},{"name":"arawak, langues","id":"awd"},{"name":"aymara","id":"aym"},{"name":"uto-azt\u00e8ques, langues","id":"azc"},{"name":"az\u00e9ri (syn : azerbaidjanais)","id":"aze"},{"name":"banda, langues","id":"bad"},{"name":"bamil\u00e9k\u00e9, langues","id":"bai"},{"name":"bachkir (syn : baskir)","id":"bak"},{"name":"baloutchi","id":"bal"},{"name":"bambara","id":"bam"},{"name":"balinais","id":"ban"},{"name":"basque","id":"baq"},{"name":"basa (syn : bassa)","id":"bas"},{"name":"baltes, langues","id":"bat"},{"name":"bedja (syn : beja, bichari)","id":"bej"},{"name":"bi\u00e9lorusse","id":"bel"},{"name":"bemba","id":"bem"},{"name":"bengali","id":"ben"},{"name":"berb\u00e8res, langues","id":"ber"},{"name":"bhojpuri","id":"bho"},{"name":"langues biharis","id":"bih"},{"name":"bikol","id":"bik"}],
}),
displayField: 'name',
valueField: 'id',
hideTrigger: true,
validate: function() {
var languagesWithSameCodeAndName = ['ewe', 'fon', 'ido', 'kom', 'lao', 'ocf', 'tiv', 'twi', 'vai', 'yao'];
return Ext.isEmpty(this.getRawValue())
|| this.getValue() != this.getRawValue()
|| languagesWithSameCodeAndName.indexOf(this.getValue()) != -1;
},
tpl: Ext.create('Ext.XTemplate',
'<tpl for="."><li role="option" class="x-boundlist-item" data-qtip="{[this.valueRenderer(values)]}">{[this.valueRenderer(values)]}</li></tpl>',
{
valueRenderer: function(values) {
return Ext.String.format('[{0}] {1}', values.id, values.name);
},
}
)
}
}
});
Ext.application({
name: 'Fiddle',
launch: function() {
Ext.create('Ext.container.Container', {
renderTo: Ext.getBody(),
items: [{
xtype: 'myapp.LanguageCombo',
fieldLabel: 'Language',
width: 320,
margin: 15,
}],
})
}
});
Это работает! Свойство ** displayField ** уже было установлено в определении класса, поэтому я не знаю, почему мне нужно поместить это свойство в объявление компонента ... В любом случае, спасибо! – guillaume26