Sencha2 JsonP push variable to Panel

Question

I am upgrading my app from Sencha 1 to Sencha 2 due to the fact that it handles JSONP a lot better.

I have my app set up and need to find out how I can push my JSONP results. Here is my JSON request

var tweet = Ext.data.JsonP.request({
    url: 'https://api.twitter.com/1/statuses/user_timeline.json',
    params: {
        'include_entities': true,
        'screen_name': 'NynasBo',
        'count': 1
    },
    callbackKey: 'callback',
    success: function(data) {
        Ext.each(data, function(i, item) {
            var tweet = i.text;
        });
    }
});

And here is the function I am trying to push it too.

var contact = Ext.define('Nynas.view.Contact', {
    extend: 'Ext.Panel',
    xtype: 'contactcard',

    config: {
        title: 'Contact',
        styleHtmlContent: true,
        html: '' + tweet.success.tweet
    },
});

But currently if I view my app I just get a undefined response. I have verified the query and also made sure that it works, by simpling switching this line from var tweet = i.text; to console.log(i.text);

You can see it will have a verified result

Alex Alex · Accepted Answer · 2012-03-14T13:37:42

Remember, in an asynchronous environment, the callback will affect your value only after it has been used. So something like this should work:

Ext.define('Nynas.view.Contact', {
extend: 'Ext.Panel',
xtype: 'contactcard',

config: {
    title: 'Contact',
    styleHtmlContent: true,
    html: ' '
},
});

var contact = Ext.create('Nynas.view.Contact');

var tweet = Ext.data.JsonP.request({
url: 'https://api.twitter.com/1/statuses/user_timeline.json',
params: {
    'include_entities': true,
    'screen_name': 'NynasBo',
    'count': 1
},
callbackKey: 'callback',
success: function(result) {
  contact.setHtml(result.data.text);
}
});

Sencha2 JsonP push variable to Panel

1 Answers