ExtJS4のネストしたモデルの扱い方メモ

extjs_nestmodel_example.js

// データ定義
var testdata = [
    {
        name: 'name1',
        value: 123,
        dates: [
            {
                date: '1a',
                note: '1aa'
            },
            {
                date: '1b',
                note: '1bb'
            }
        ]
    },
    {
        name: 'name2',
        value: 234,
        dates: [
            {
                date: '2a',
                note: '2aa'
            },
            {
                date: '2b',
                note: '2bb'
            }
        ]
    },
    {
        name: 'name3',
        value: 345,
        dates: [
            {
                date: '3a',
                note: '3aa'
            },
            {
                date: '3b',
                note: '3bb'
            }
        ]
    }
];

// 内側のモデル定義
Ext.define('DateData', {
    extend: 'Ext.data.Model',
    idProperty: 'name',
    fields: [
        { name: 'date' },
        { name: 'note' }
    ]
});

// 外側のモデル定義
Ext.define('TestData', {
    extend: 'Ext.data.Model',
    idProperty: 'name',
    fields: [
        { name: 'name' },
        { name: 'value' }
    ],
    associations: [
        { type: 'hasMany', model: 'DateData', name: 'dates' }
    ]
});

// データストア定義とデータの読み込み
var testDataStore = Ext.create('Ext.data.Store', {
    autoLoad: true,
    model: 'TestData',
    data: testdata,
    proxy: {
        type: 'memory',
        reader: {
            type: 'json'
        }
    }
});

// 外側のデータストアを検索する
var tidx = testDataStore.find('name', 'name2');
var tmodel = testDataStore.getAt(tidx);
alert(tmodel.get('value'));

// そのレコードに結び付いているサブモデルのストアを取り出す
var sub_store = tmodel.dates();
alert(sub_store.getAt(0).get('note'));