Изменение Ext.data.Store для combo
Безуспешно пытаюсь изменить содержимое combo (ExtJS 4) локальными (!) данными (через Ajax все работает как в примерах и расписано).
Испробовал варианты: - combo.store.loadData(...) - загрузка данных - combo.store = new Ext.create('Ext.data.Store',... - .... Во всех случаях данные в хранилище изменяются, но в combo или не перерисовывается или перерисовывается через раз. Спасибо. |
Странная особенность combо. После изменения store нужно вызывать
combo.bindStore(combo.store); И это даже работает! Но не всегда. В моем примере перерисовка и отработка перерисовки после смены store начинает происходить только если по нему предварительно кликнули ранее мышкой. Эмуляция клика ни к чему не приводит. = Поиск по гуглю bindStore показал, что с похожими проблемами столкнулся не я один. = Неработающий пример не привожу - громоздкий код. Работающий пример: combo1 = new Ext.form.ComboBox({
renderTo: 'ex3',
queryMode: 'local',
displayField:'v',
valueField:'id',
store: Ext.create('Ext.data.Store', {
fields: [{name: 'id', type: 'string'},{name: 'v', type: 'string'}], data : [{id:1,v:0},{id:999999999,v:1}]
}),
listeners:{select: function(combo, value) {
combo2.clearValue();
combo2.store.loadData([{id:1,v:combo1.getValue()}]);
combo2.bindStore(combo2.store); /* !! */
},
}
});
combo2 = new Ext.form.ComboBox({
renderTo: 'ex2',
id:"e2",
queryMode: 'local',
displayField:'v',
valueField:'id',
store: Ext.create('Ext.data.Store', {
fields: [{name: 'id', type: 'string'},{name: 'v', type: 'string'}], data : []
})
});
|
Складывается впечатление что у вас нет понимания что такое тип данных.
Например судя по этому {name: 'id', type: 'string'}
тоесть вы указали что тип - строковый, а в data у вас целочисленный. А это вообще не понятно зачем listeners:{select: function(combo, value) {
combo2.clearValue();
combo2.store.loadData([{id:1,v:combo1.getValue()}]);
combo2.bindStore(combo2.store); /* !! */
},
вот вам к размышлению, если уж на то пошло... <!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>лалала</title>
<script type='text/javascript' src='http://docs.sencha.com/ext-js/4-0/extjs/ext-all.js'></script>
<link rel="stylesheet" type="text/css" href="http://docs.sencha.com/ext-js/4-0/extjs/resources/css/ext-all.css">
<script>
Ext.onReady(function() {
var combo1 = Ext.create('Ext.form.ComboBox', {
renderTo: Ext.getBody(),
queryMode: 'local',
width: 200,
labelAlign: 'right',
fieldLabel: 'Комбо1',
displayField: 'value',
valueField: 'id',
store: Ext.create('Ext.data.Store', {
fields: [
{name: 'id', type: 'int'},
{name: 'value', type: 'string'}
],
data: [
{id: 1, value: 'Россия'},
{id: 2, value: 'Китай'},
{id: 3, value: 'Австралия'}
]
}),
listeners:{
select: function() {
combo2.reset();
combo2.getStore().removeAll();
combo2.getStore().loadData([
{id: this.getValue(), value: this.getRawValue()}
]);
combo2.setValue(this.getValue());
},
}
});
var combo2 = Ext.create('Ext.form.ComboBox', {
renderTo: Ext.getBody(),
width: 200,
id: "e2",
anchor: '100%',
labelAlign: 'right',
queryMode: 'local',
fieldLabel: 'Комбо2',
displayField: 'value',
valueField: 'id',
store: Ext.create('Ext.data.Store', {
fields: [
{name: 'id', type: 'int'},
{name: 'value', type: 'string'}
],
data : []
})
});
});
</script>
<body>
</body>
</html>
|
В продолжение темы, задача немного другая.
Есть данные статичные которые должны быть добавлены в начало Combo, есть данные из базы которые добавляются через JsonReader. Как мне объединить оба формата данных в одном Combo. Уже пытался и add делать для store, и load и loadData... В разных случаях получаются разные ошибки в ядре ext. Что я делаю не так? (Ext 3.4 - выше пока использовать не могу.) var store = new Ext.data.Store({
url: 'AJAX_URL',
fields: ['title', 'value'] ,
reader: new Ext.data.JsonReader({
root: 'root',
}, [
{ name: 'title', mapping: 'title' },
{ name: 'value', mapping: 'value' }
])
});
// где _p = new Ext.form.FormPanel
_p.add({
xtype: 'combo',
fieldLabel: title,
id: id,
name: name,
store: store,
/* второй вариант
store: new Ext.data.ArrayStore({
fields: ['value'],
data: [{title: 'title', value: 'value'}, {title: 'title2', value: 'value2'}]
})*/,
valueField: 'value',
typeAhead: false,
displayField:'title',
//mode: 'local',
forceSelection: false,
triggerAction: 'all',
editable: false
});
store.loadData([{title: 'title', value: 'value'}, {title: 'title2', value: 'value2'}]);
_p.doLayout();
По раздельности работает, вместе нет. Пишет ошибку где-то в недрах ext (Cannot read property 'length' of undefined ) UPD Добавил data в правильном формате fields: ['title', 'value'] ,
data: {"root":[{"title":"title","value":"value"},{"title":"title","value":"value"},{"title":"title","value":"value"}]},
reader: new Ext.data.JsonReader({
Стало чуть чуть лучше, теперь надо понять как сделать так чтобы Json ответ не затирал все содержимое Combo, а добавлял в конец. UPD2 Нашел решение Надо для store прописать listeners: {
load: function() {
var rec = new Ext.data.Record.create([{name: 'title', type: 'string'},{name: 'value', type: 'string'}]);
this.insert(0, new rec({title: 'title2', value: 'value2'}));
}
}
|
| Часовой пояс GMT +3, время: 06:22. |