Extjs 4 Load Array Data using Model

Question

I feel like I may be over complicating this. Please feel free to send me in a different direction.

I'm trying to load an array of records (the values) with only values, into model objects, using the fields defined in my model (the keys).

My Model

Ext.define('MyApp.model.AppData', {
    extend: 'Ext.data.Model',
    fields: [
        {name: 'key'},
        {name: 'value'},
        {name: 'desc'},
        {name: 'index', type: 'int'},
        {name: 'type'}
    ]
});

My Store

Ext.define('MyApp.store.AppData', {
    extend: 'Ext.data.ArrayStore',
    groupField: 'type',
    model: 'MyApp.model.AppData',
    autoload: false,
    constructor: function (config) {
        var data = [
            ['val1', 'val2', 'val3', 'val4', 'val5'],
            ['val1', 'val2', 'val3', 'val4', 'val5'],
            ...
        ];
    this.loadData(data);
    }
});

So the end goal here is to have my data in the store looking like

[
    {'key':'val1', 'value':'val2', 'desc':'val3', 'index':'val4', 'type':'val5'},
    {...},
    {...}
]

Currently getting a 'me.removed is undefined' error. I know its related to the loadData() function. Which makes me feel like I'm not using this correctly somewhere.

I could just hardcode the data formatted with the key value pairs... but that just feels unmaintainable and wrong way to do this.

Thanks!

That is what the array reader is for: docs.sencha.com/extjs/4.2.5/#!/api/Ext.data.reader.Array — Evan Trimboli
– Evan Trimboli, Commented Feb 12, 2016 at 3:58

tonymayoral · Accepted Answer · 2016-02-12 16:27:33Z

1

You can just use store's data config:

var myModel=Ext.define('MyApp.model.AppData', {
    extend: 'Ext.data.Model',
    fields: [
        {name: 'key'},
        {name: 'value'},
        {name: 'desc'},
        {name: 'index', type: 'int'},
        {name: 'type'}
    ]
});

var myData = [
      ['val1', 'val2', 'val3', 0, 'val5'],
      ['val1', 'val2', 'val3', 1, 'val5']
];

var store = Ext.create('Ext.data.ArrayStore', {
    model:myModel,
    data:myData
});

Here's a working fiddle

answered Feb 12, 2016 at 16:27

tonymayoral

5,2872 gold badges28 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Goat Over a year ago

Perfect, and simple. Thanks Tony!

Collectives™ on Stack Overflow

Extjs 4 Load Array Data using Model

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related