Форум

yo-y0 · #1 (**permalink**) 22.12.2011, 13:47

Безуспешно пытаюсь изменить содержимое combo (ExtJS 4) локальными (!) данными (через Ajax все работает как в примерах и расписано).
Испробовал варианты:
- combo.store.loadData(...) - загрузка данных
- combo.store = new Ext.create('Ext.data.Store',...
- ....
Во всех случаях данные в хранилище изменяются, но в combo или не перерисовывается или перерисовывается через раз.
Спасибо.

yo-y0 · #2 (**permalink**) 23.12.2011, 18:49

Странная особенность 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 : []
        })
    });

nekto_O · #3 (**permalink**) 23.12.2011, 20:51

Складывается впечатление что у вас нет понимания что такое тип данных.
Например судя по этому

{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>

goldserg · #4 (**permalink**) 20.08.2012, 14:51

В продолжение темы, задача немного другая.
Есть данные статичные которые должны быть добавлены в начало 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'}));
    }
  }

Форум

Справочник

Discord чат

Курсы javascript