1. #1
    Sencha User
    Join Date
    Mar 2012
    Posts
    24
    Vote Rating
    1
    rvelasquez is on a distinguished road

      0  

    Default Unanswered: Can't get inline data store to work.

    Unanswered: Can't get inline data store to work.


    Hi,

    I'm trying to display a list of items in a tab panel using an inline data store. I have the following code:

    Main View:

    Code:
    ...
            listeners: {
                show: function() {
                    var store = Ext.create('MyApp.store.TeamMembers');
                    var teamList = Ext.getCmp('teamList');
                    store.load();
                    teamList.setStore(store);
                    teamList.refresh();
                }
            },
    ... 
    // Second item in tab panel
                {
                    title: 'Teams',
                    iconCls: 'team',
                    xtype: 'list',
                    id: 'teamList',
                    itemTpl: '<div>{firstname}</div>',
    
    
                    items: [
                        {
                            docked: 'top',
                            xtype: 'titlebar',
                            title: 'Teams'
                        }
                    ]
                },
    Model:

    Code:
    Ext.define('MyApp.model.TeamMember', {
        extend: 'Ext.data.Model',
        fields: ["firstname", "lastname", "team", "title", "description"]
    });
    Store:

    Code:
    Ext.define('MyApp.store.TeamMembers', {
        extend: 'Ext.data.Store',
    
    
        config: {
            model: 'MyApp.model.TeamMember',
            data: [
                {
                    firstname: "Firstname",
                    lastname: "Lastname",
                    team: "Team",
                    title: "Title",
                    description: "Description"
                },
                {
                    firstname: "Firstname2",
                    lastname: "Lastname2",
                    team: "Team2",
                    title: "Title2",
                    description: "Description2"
                }
            ]
        }
    });
    What's happening is I see a list of two items in the second tab panel but there is no content in either row (I expect to see two rows both populated with a firstname according to the itemTpl configuration.

  2. #2
    Sencha User
    Join Date
    Apr 2012
    Location
    Toronto, Canada
    Posts
    92
    Answers
    20
    Vote Rating
    12
    iSmartDevice is on a distinguished road

      1  

    Default


    http://docs.sencha.com/touch/2-0/#!/...re-method-load

    The function "load" is invoked asynchronously.
    Code:
    show: function() {
        var store = Ext.create('MyApp.store.TeamMembers'); 
        store.load({        
            callback: function(records, operation, successful) {
                 // the operation object contains all of the details of the load operation
                console.log(records);
            }
        });
    }

  3. #3
    Sencha User
    Join Date
    Mar 2012
    Posts
    24
    Vote Rating
    1
    rvelasquez is on a distinguished road

      0  

    Default


    I tried hooking up the setting of the store and refresh in the load callback but that didn't work. What you're saying makes sense but doesn't explain why the list view is showing two empty rows. If I change the the data property to only have one item then the list view will only show one empty row. So somehow the list view knows how many items I have but doesn't know the content of the items. My itemTpl property is set properly so I'm not sure what's going on.

    Screen Shot 2012-06-25 at 6.09.24 AM.png

  4. #4
    Sencha User
    Join Date
    Apr 2012
    Location
    Toronto, Canada
    Posts
    92
    Answers
    20
    Vote Rating
    12
    iSmartDevice is on a distinguished road

      0  

    Default


    I'm not sure why it occurs. Let's do another way to show the list. Do you see the data in the list with the following code?

    Code:
    // app.js
    models:['TeamMember'],
    stores:['TeamMembers'],
    Code:
    show: function() {
        // Comment out not to load the store here
        /*
        var store = Ext.create('MyApp.store.TeamMembers'); 
        store.load({        
            callback: function(records, operation, successful) {
                 // the operation object contains all of the details of the load operation
                console.log(records);
            }
        });*/
    }
    
    
    {
        title: 'Teams',
        iconCls: 'team',
        store: 'TeamMembers',
        xtype: 'list',
        id: 'teamList',
        itemTpl: '<div>{firstname}</div>',
    
    
    
    
        items: [
            {
                 docked: 'top',
                 xtype: 'titlebar',
                 title: 'Teams'
            }
       ]
     },

  5. #5
    Sencha User jerome76's Avatar
    Join Date
    Apr 2012
    Location
    New Jersey
    Posts
    1,135
    Answers
    129
    Vote Rating
    99
    jerome76 is just really nice jerome76 is just really nice jerome76 is just really nice jerome76 is just really nice jerome76 is just really nice

      1  

    Default


    Quote Originally Posted by rvelasquez View Post
    Model:

    Code:
    Ext.define('MyApp.model.TeamMember', {
        extend: 'Ext.data.Model',
        fields: ["firstname", "lastname", "team", "title", "description"]
    });
    It looks like your definition is wrong, and it may be setting up your model wrong. (I could be wrong though) This is how it should be:

    Code:
    Ext.define('MyApp.model.TeamMember', {
        extend: 'Ext.data.Model',
        config: {
            fields: ["firstname", "lastname", "team", "title", "description"]
        }
    });
    Try that if nothing else works.

Thread Participants: 2

Tags for this Thread

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar