数据数组作为extjs中的模型属性

Question

I have a model in extjs like this:

Ext.define('Game', {
    extend: 'Ext.data.Model',
    fields: [
        { name: 'id', type: 'int' },
        { name: 'Name', type: 'string' },
        //{ name: 'levels' , type:'array'},
    ]
});

I want to use this model for a grid store,but its third property

//{ name: 'levels' , type:'array'}

is an array of data which i want to show them in dynamically created columns of my grid. I think maybe associations on extjs model may bring me a solution but i'm confused how to use them.any solution will be appriciated.

Answer 1

Just use the type: 'auto' setting and your array will be untouched.

Ext.define('Game', {
    extend: 'Ext.data.Model',
    fields: [
        { name: 'id', type: 'int' },
        { name: 'Name', type: 'string' },
        { name: 'levels' , type:'auto'},
    ]
});

And then you could define your columns with renderers like so:

columns: [
    {
        text: "ID",
        dataIndex: "id"
    },
    {
        text: "Name",
        dataIndex: "Name"
    },
    {
        text: "Array Item 1",
        dataIndex: "levels",
        renderer: function(value){
             return levels[0];
        }
    },
    {
        text: "Array Item 2",
        dataIndex: "levels",
        renderer: function(value){
             return levels[1];
        }
    }
]

If you wanted to dynamically add columns by items in the array, you would actually have to figure out which record has the array with the most items in it and then add as many columns as you needed to the column array and then set the grid's columns with the .configure method. This could probably be done on the store's load event.

Answer 2

Supposing this is the data for your model -

{
  "id": 1,
  "name": "game",
  "levels": ["level 1", "level 2", "level 3"]
}

You can always define your model as

Ext.define('Game', {
    extend: 'Ext.data.Model',
    requires: [
        'Ext.data.field.Integer',
        'Ext.data.field.String'
    ],
    fields: [
        { 
            name: 'id', type: 'int' 
        },
        { 
            name: 'Name', type: 'string' 
        },
        { 
            name: 'levels'
        }
    ]
});

Leaving the type empty will be interpreted as "auto" and thus no conversion will be applied to that field.

PS: Mind the trailing commas. :)