Петля в сетке EXTJs

Question

У меня есть какой-то магазин, в котором формируются данные.На панели это выглядит как «fieldName» и текстовое поле (в зависимости от вызванной формы).Например, на одной форме отображается «имя документа» и поле, на другой - дата продажи и поле даты.Данные формируются динамически

Вот хранилище:

tableTempStore = new Ext.data.JsonStore({
    url: objectUrlAddress,
    baseParams: {
        'objectID': objectID
    },
    root: 'Fields',
    fields: [{
        name: 'Type',
        type: 'int'
    }, {
        name: 'Value'
    }, {
        name: 'IsRequired',
        type: 'bool'
    }, {
        name: 'Identifier'
    }, {
        name: 'Data'
    }],
    listeners: {
        load: function(obj, records) {
            Ext.each(records, function(rec) {

                var item = null;
                switch (rec.get('Type')) {
                    case 0:
                        item = new Ext.form.NumberField();
                        item.id = rec.get('Identifier');
                        item.fieldLabel = rec.get('Hint');
                        var isRequired = rec.get('IsRequired');
                        item.anchor = '100%';
                        item.allowBlank = !isRequired;
                        item.disabled = editDisabled;
                        item.value = rec.get('Data');
                        break;
                    case 1:
                        item = new Ext.form.NumberField();
                        item.id = rec.get('Identifier');
                        item.fieldLabel = rec.get('Hint');
                        var isRequired = rec.get('IsRequired');
                        item.anchor = '100%';
                        item.allowBlank = !isRequired;
                        item.allowDecimals = true;
                        item.disabled = editDisabled;
                        item.value = rec.get('Data');
                        break;
                }
                if (item != null) {
                    templateGrids.add(item);
                    columnsTable = item.__proto__.constructor.xtype;
                   source[item.fieldLabel] = '';
                    var s = null;
                    if (columnsTable == 'textfield')
                    {
                        s = 'textfield';
                        colm = {
                                xtype: s, 
                                id: item.id,
                                allowBlank: item.allowBlank, 
                                format: item.format,
                                value: item.value,
                                editable: true,
                                emptyText: item.emptyText,
                                disabled: item.disabled
                        };
                    }
                    else if (columnsTable == 'combo')
                    {
                        s = 'combo';
                        colm = {
                                xtype: s, 
                                id: item.id,
                                allowBlank: item.allowBlank, 
                                format: item.format,
                                value: item.value,
                                editable: true,
                                emptyText: item.emptyText,
                                disabled: item.disabled
                        };
                    }
                    else if (columnsTable == 'datefield')
                    {
                        s = 'datefield';
                        colm = {
                                xtype: s, 
                                id: item.id,
                                allowBlank: item.allowBlank, 
                                format: item.format,
                                value: item.value,
                                editable: true,
                                emptyText: item.emptyText,
                                disabled: item.disabled
                        };
                    }
            });
            for (var i = 0; i < templateGrids.getStore().data.length; i++) { 
                templateGrids.getColumnModel().setConfig([
                    {header: 'Name', id:'name', width:200}, 
                    {header:'Value', id:'val', dataIndex: rec.get('Value'), editable:true, width:200, editor: colm}]);
                    };
        }
    }
});

Этот код работал в форме, но мне нужно использовать Grid (или Grid Editor).Я знаю, как отображается имя поля («имя документа» и т. Д.), Но я не понимаю, как отображается текстовое поле и т. Д. Я пытаюсь использовать цикл, но во втором столбце в xtype отображается последний тип в хранилище.Как я могу решить эту проблему?!

Вот сетка:

var templateGrids = new Ext.grid.EditorGridPanel({
        id: 'tableId',
        height:300,
        width: '100%',
        clicksToEdit:1,
        frame: true,
        store: tableTempStore,
        columns: [
        {header: 'Name'}, 
        {header: 'Value'}]
        });