Final Release - problem binding nested data to models

[akpi]

Hi,

Yesterday we updated our project to the Sencha 2 final release and code that was previously binding nested data successfully to associated models is no longer working correctly. It still binds the parent but only the first of the child records. Here is the code:

Store:

Ext.define('PlayingPartner.store.CourseStore', {
    extend: 'Ext.data.Store',
    requires: ['Ext.data.Store',
                'PlayingPartner.model.CourseSelection'],


    config: {
        storeId: 'courseStore',
        model: 'PlayingPartner.model.CourseSelection',
        proxy: {
            url: Ext.DataserviceBaseUrl + 'courseSelection',
            type: 'rest',
            reader: {
                type: 'json'
            }
        }
    }
});

Parent Model:

Ext.define('PlayingPartner.model.CourseSelection', {
    extend: 'Ext.data.Model',
    requires: ['PlayingPartner.model.CourseDiscipline'],
    config: {
        fields: [
                { name: 'Id', type: 'int' },
                { name: 'Name', type: 'string' },
                { name: 'Shots', type: 'int' }
            ],
        hasMany: { model: 'PlayingPartner.model.CourseDiscipline', name: 'DisciplineList', associationKey: 'Disciplines' }
    }
});

Child Model:

Ext.define('PlayingPartner.model.CourseDiscipline', {
    extend: 'Ext.data.Model',
    config: {
        fields: [
                { name: 'Id', type: 'int' }
            ],
        belongsTo: 'PlayingPartner.model.CourseSelection'
        }
});

The data is being returned in the following format:

[{
  "Disciplines":
    [
      {"Id":1}
    ],
  "Id":1,
  "Name":"One Shot",
  "Shots":1
},
{
  "Disciplines":
    [
      {"Id":1},
      {"Id":6},
      {"Id":2},
      {"Id":4},
      {"Id":3},
      {"Id":5}
    ],
  "Id":2,
  "Name":"Demonstration Course",
  "Shots":7
}]

As I said, this was working before the upgrade but perhaps there are syntax errors here that could be causing it to break with the new release.

Can anyone help?

Thanks.

[mitchellsimoens]

Using your code and this instance it all works for me with GA release:

new PlayingPartner.store.CourseStore({
    autoLoad  : true,
    listeners : {
        load : function(store) {
            var rec         = store.getAt(0),
                disciplines = rec.DisciplineList();

            console.log(disciplines);
        }
    }
});

[Jamie Avins]

Do you have any steps we might need to do to recreate the problem?

[akpi]

This is the code in my controller which is calling the load method on the store:

Ext.define('PlayingPartner.controller.CourseSelection', {
    extend: 'PlayingPartner.controller.Base',
    requires: [
        'PlayingPartner.view.courseSelection.CourseList'
    ],
    init: function () {
        console.log('CourseSelection controller init method...');
        window.me = this;
    },


    config: {
        control: {
            backButton: { tap: function () { me.redirectToRoute('gamemode'); } },
            drivingButton: { tap: function () { this.filterByDiscipline(1); } },
            greensButton: { tap: function () { this.filterByDiscipline(2); } },
            scramblingButton: { tap: function () { this.filterByDiscipline(3); } },
            shortButton: { tap: function () { this.filterByDiscipline(4); } },
            puttingButton: { tap: function () { this.filterByDiscipline(5); } },
            fairwayButton: { tap: function () { this.filterByDiscipline(6); } }
        },


        refs: {
            courseList: '#courseList',
            backButton: 'courselist navigationtitlebarwithaddplayers button[action=back]',
            drivingButton: 'button[action=driving]',
            greensButton: 'button[action=greens]',
            scramblingButton: 'button[action=scrambling]',
            shortButton: 'button[action=short]',
            puttingButton: 'button[action=putting]',
            fairwayButton: 'button[action=fairway]'
        },


        routes: {
            'courses/:id': 'load'
        }
    },


    load: function (id) {
        console.log("round action of CourseSelection Controller");
        me.setView('courselist', 'courseList');
        var store = this.getCourseList().getStore();
        store.load({ params: { gameMode: id} });
        store.clearFilter();
    },

Still can't get it to work for us. Seems odd that it is binding the first child 'Discipline' of each item but no more.

Thanks.

[Jamie Avins]

Thank you for the test case.

[TommyMaintz]

Hi akpi,

Unfortunately I'm not able to reproduce this issue. When I run the following code using the json you provided the disciplines are correctly loaded.

        Ext.define('PlayingPartner.store.CourseStore', {
            extend: 'Ext.data.Store',

            config: {
                storeId: 'courseStore',
                model: 'PlayingPartner.model.CourseSelection',
                proxy: {
                    url: 'disciplines.json',
                    type: 'rest',
                    reader: {
                        type: 'json'
                    }
                }
            }
        });

        Ext.define('PlayingPartner.model.CourseSelection', {
            extend: 'Ext.data.Model',
            config: {
                fields: [
                    { name: 'Id', type: 'int' },
                    { name: 'Name', type: 'string' },
                    { name: 'Shots', type: 'int' }
                ],
                hasMany: {
                    model: 'PlayingPartner.model.CourseDiscipline',
                    name: 'DisciplineList',
                    associationKey: 'Disciplines'
                }
            }
        });

        Ext.define('PlayingPartner.model.CourseDiscipline', {
            extend: 'Ext.data.Model',
            config: {
                fields: [
                    { name: 'Id', type: 'int' }
                ],
                belongsTo: 'PlayingPartner.model.CourseSelection'
            }
        });

        Ext.setup({
            onReady: function() {
                var store = Ext.create('PlayingPartner.store.CourseStore');
                store.load({ params: { gameMode: 5}, callback: function() {
                    console.log(store);
                }});
            }
        });

Is there anything else that you think might cause the associations to load? Anything in your setup that is slightly different then the test case I've created?

Best,
Tommy