How can I load a JSON result into a panel?

[patrickdeamorim]

I have been trying combinations of all I could think of and I also found nothing from searching, but what I'm trying to do is load a JSON object from my server and then use that to render a panel with a video, info, etc.

But I can't get anything to work though, what am I doing wrong here?

{
    xtype: 'panel',
    navigationBar: {hidden: true},
    title: 'Video feed',

    html: '<video width="320" height="240" controls="controls"><source src="{video.url}" type="video/mp4"></video>',

    store: {
        autoLoad: true,
        fields: ['video'],
        proxy: { type: 'jsonp', url: 'http://patrick.includu.com/app/appvideos/getVideoPage/234', reader: { type: 'json' } }
    }
}

[rgporter]

Your HTML has the curly braces that's used for template parsing but itself is not a Template or XTemplate. If you look up templating you should find what you're looking for.

[patrickdeamorim]

I read up on XTemplate and I also tried using tpl: instead of html: and also that did not seem to work. Do you have an example of using a template which gets data straight from a JSON request?

[Schildi]

Hi patrickdeamorim,

hmm, in the docs I can't see that a "store"-config for the panel-component is even possible...

But maybe you could try the "record"-config in combination with a "tpl" instead.

record : Ext.data.Model
A model instance which updates the Component's html based on it's tpl. Similar to the data configuration, but tied to to a record to make allow dynamic updates. This must be a model instance and not a configuration of one.

(http://docs.sencha.com/touch/2-0/#!/...nel-cfg-record)

But that would mean, that you have to define your store (fields, proxy etc.) in an other place. Here you should use a controller (separation of logic and output) where you can use the setRecord()-method of the panel.

Mind that there's also the component Ext.Video (http://docs.sencha.com/touch/2-0/#!/api/Ext.Video) which offers a setUrl()-method.
Maybe that could also be a good alternative for you

Hope this helps you a little bit.
Best regards,
Schildi

[patrickdeamorim]

It seems like there's no simple solution so I then better dive deeper into Sencha and learn how to use models and records. At least I'll hopefully have cleaner and more organized code in the end result and also learn a lot on the way.

Thank you very much for the help, Schildi!