ExtJS 4 grid.Panel, как использовать dataIndex подэлемента - PullRequest
Новая
       37

ExtJS 4 grid.Panel, как использовать dataIndex подэлемента

2 голосов
/ 28 ноября 2011

Я пытаюсь отобразить данные в сетке ExtJS.У меня это в основном работает, но в моем массиве данных у меня есть массив, содержащий дополнительные данные (названный «дополнительные»).Мне нужно отобразить поля из этого подмассива:

Вот несколько примеров данных, возвращающихся с моего сервера в ExtJS (Прямой прокси) - это одна запись: 

{"type":"rpc","tid":6,"action":"EncounterService","method":"getRecords","result":[{"id":"20","addedDate":"2011-09-22 11:02:04","clientID":"19","extra":{"gender":"M"}}]}

Inмоя Ext.grid.Panel, у меня есть набор Store, модель которого выглядит следующим образом: 

Ext.define('ESDB.model.Encounter', {
    extend: 'Ext.data.Model',
    fields: ['id','addedDate','clientID','extra']
});

Наконец, мой Ext.grid.panel, мои столбцы определены: 

 this.columns = [
          {header: 'id', dataIndex: 'id', flex: 1}
              {header: 'gender', dataIndex: 'extra.gender', flex: 1}
   ]

Будет отображаться идентификатор - как и любое другое поле в базовом массиве «result».Тем не менее, я «extra.gender» не работает.Как я могу добавить столбец и сделать так, чтобы он отображал гендерную строку из «дополнительного» объекта массива в моем массиве «result»?

Ответы [ 3 ]

4 голосов
/ 01 марта 2013

Правильный способ сделать это - использовать отображение.

http://docs.sencha.com/ext-js/4-1/#!/api/Ext.data.Field-cfg-mapping

Настройка поля примерно так: 

        {name: 'gender', mapping: 'extra.gender'}

Даст вам поле с именем пол, которое было извлечено из соответствующих объектов и т. Д.

1 голос
/ 18 сентября 2015

Вы можете использовать функцию рендеринга столбца: 

this.columns = [
{
    flex: 1,
    header: 'gender',
    dataIndex: 'extra',
    renderer: function(extra){
        return extra.gender;
    }
}]
0 голосов
/ 30 ноября 2011

Насколько я знаю, Ext не поддерживает такого рода вложенные данные из коробки. Вы можете расширить модель и переопределить методы get / set для поддержки этого. Ниже приведен пример того, как вы можете переопределить метод get. 

var model = Ext.define("Ext.data.reader.SomeModel", {
    extend: 'Ext.data.Model',
    fields: [
        {name: 'name'},
        {name: 'extra.gender'}
    ],
    get: function(field){
        if (field.indexOf('.') !== -1) {
            var parts = field.split('.');
            var value = Ext.data.Model.prototype.get.call(this, parts[0]);

            return Ext.isObject(value) ? value[parts[1]] : undefined;
        }
        return Ext.data.Model.prototype.get.call(this, field);
    }
})

Набор содержит больше кода, но его все равно довольно просто переопределить.

...