1. #1
    Sencha User
    Join Date
    Jun 2011
    Posts
    47
    Vote Rating
    0
    borden0108 is on a distinguished road

      0  

    Default Template Stopped Data Load

    Template Stopped Data Load


    Hi all,

    I have been trying to get a nested list to work for a timetable.the basic idea is the user clicks on the day and then the period.

    up until now it has been working then i changed the the template to look for the value of model and have a day or period template decided on this information. the period now does not show a list rather than a load of borders. I had this problem on my first list and then i coppied the template to be the same and it works but now this list does not.
    screenshot.jpg


    Viewport.js
    Code:
    NestedListDemo.views.Viewport = Ext.extend(Ext.NestedList, {    fullscreen: true,
        title: 'Timetable',
        store: NestedListDemo.music_store,
        getDetailCard: function(item, parent) {
            var itemData = item.attributes.record.data,
            parentData = parent.attributes.record.data,
            detailCard = new Ext.Panel({
                scroll: 'vertical',
                styleHtmlContent: true,
                tpl: ["<h2>Period {title}: {class}</h2><p>Teacher:{teacher}</br>Location:{room}<p>"]
            });
            detailCard.update(itemData);
            this.backButton.setText(parentData.text);
            return detailCard;
        },
        getItemTextTpl: function() {
            var tplConstructor =  '<tpl if="model === \'day\'">'+
                    'Day {title}' 
                '</tpl>'+
                '<tpl if="model === \'period\'">'+
                    'Period {class}' 
                '</tpl>' ;
            return tplConstructor;
        }
      
    });
    listitem.js
    Code:
    Ext.regModel('ListItem', {    fields: [
            {name: 'title', type: 'string'},
            {name: 'teacher', type: 'string'},
            {name: 'model', type: 'auto'},
            {name: 'room', type: 'string'},
            {name: 'class', type: 'string'},
        ]
    });
    json file

    Code:
    {
        "items": [
            {
                "title": "1",
                "model": "day",
                "items": [
                    {
                        "title": "1",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "2",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "3",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "4",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "5",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "6",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    }
                ]
            },
            {
                "title": "2",
                "model": "day",
                "items": [
                    {
                        "title": "1",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "2",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "3",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "4",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "5",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "6",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    }
                ]
            },
            {
                "title": "3",
                "model": "day",
                "items": [
                    {
                        "title": "1",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "2",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "3",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "4",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "5",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "6",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    }
                ]
            },
            {
                "title": "4",
                "model": "day",
                "items": [
                    {
                        "title": "1",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "2",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "3",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "4",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "5",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "6",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    }
                ]
            },
            {
                "title": "5",
                "model": "day",
                "items": [
                    {
                        "title": "1",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "2",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "3",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "4",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "5",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "6",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    }
                ]
            },
            {
                "title": "6",
                "model": "day",
                "items": [
                    {
                        "title": "1",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "2",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "English",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "3",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "4",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "5",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    },
                    {
                        "title": "6",
                        "teacher": "SBG",
                        "room": "S22",
                        "class": "english",
                        "model": "period",
                        "leaf": true
                    }
                ]
            }
        ]
    }
    thanks matt

  2. #2
    Sencha - Services Team AndreaCammarata's Avatar
    Join Date
    Jun 2009
    Posts
    1,394
    Vote Rating
    22
    AndreaCammarata has a spectacular aura about AndreaCammarata has a spectacular aura about

      0  

    Default


    Hi matt.
    Try to remove what is red and add what is blue.

    Code:
     var tplConstructor =  '<tpl if="model === \'day\'">'+
            'Day {title}' +
        '</tpl>'+
        '<tpl if="model === \'period\'">'+
            'Period {class}'  +
        '</tpl>' ;
    PS: You can even set your "model" field as "string" instead of "auto".

    Hope this helps.
    Sencha Inc
    Andrea Cammarata, Solutions Engineer
    CEO at SIMACS

    @AndreaCammarata
    www.andreacammarata.com
    github: https://github.com/AndreaCammarata

    TUX components bundle for Sencha Touch 2.x.x
    http://www.tux-components.com/


Thread Participants: 1

Tags for this Thread