1. #1
    Sencha User aswinramakrish's Avatar
    Join Date
    Aug 2011
    Location
    Denver, CO
    Posts
    14
    Vote Rating
    1
    aswinramakrish is on a distinguished road

      0  

    Default tpl.applyTemplate returns 'undefined' is not an object error

    tpl.applyTemplate returns 'undefined' is not an object error


    I've just started playing around with Sencha Touch and I'm trying to apply a template from JSON, through an ajax call and I've been getting this error.

    TypeError: 'undefined' is not an object (evaluating 'tpl.applyTemplate')

    My JSON is just a regular one (Tested with JSON lint and it works fine).
    My success property of the ajax call looks something like this:


    Code:
    success: function (response) {
        var data = Ext.util.JSON.decode(response.responseText);
        console.log(data);
        var html = tpl.applyTemplate(data);
        console.log(html);
        Ext.getCmp('dPanel').update(html);
    }


    Here is the template that I used:


    Code:
    var tpl = Ext.XTemplate(
            '<tpl for=".">',
            '<div class="field">',
            '<div class="fieldHeader">Number: #{Id}</div>',
             '<div class="fieldData">',
             '<ul>',
             '<li><b>Date:</b> {Date}</li>',
             '<li><b>Contact @:</b> {Contact}</li>',
             '<li><b>Type:</b> {Type}</li>',
             '<li><b>Organization Info:</b> {Organization}</li>',
             '</ul>',
             '</div>',
             '<div class="Text">',
             '<hr>',
             '<b>Description</b>',
             '<p>{Description}</p>',
             '</div>',             
             '</div>',
             '</tpl>'
    );
    More Info: The console.log(data) shows a clean JSON. I also tried using Ext.decode and tpl.apply()though my template was an XTemplate. Still, no luck..
    Any help would be highly appreciated!

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,754
    Vote Rating
    827
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    You will need to Ext.decode the JSON string to make it actual JS code. This is working for me:

    Code:
    var tpl = new Ext.XTemplate(
        '<tpl for=".">',
            '<div class="field">',
                '<div class="fieldHeader">Number: #{Id}</div>',
                '<div class="fieldData">',
                    '<ul>',
                        '<li><b>Date:</b> {Date}</li>',
                        '<li><b>Contact @:</b> {Contact}</li>',
                        '<li><b>Type:</b> {Type}</li>',
                        '<li><b>Organization Info:</b> {Organization}</li>',
                    '</ul>',
                '</div>',
                '<div class="Text">',
                    '<hr>',
                    '<b>Description</b>',
                    '<p>{Description}</p>',
                '</div>',
            '</div>',
        '</tpl>'
    );
    
    //The following can be an Array of Objects or just an Object
    var html = tpl.apply([{
        Id           : 10,
        Date         : '2011-11-18',
        Contact      : '111-111-1111',
        Type         : 'Phone',
        Organization : 'Sencha Inc',
        Description  : 'Sencha Touch is freakin sweet!'
    }]);
    
    console.log(html);
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..."