PDA

View Full Version : XTemplate to Ext.dom.Element



webid
14 Oct 2013, 12:17 AM
Hi,


I create a component extending Ext.panel.Panel and loading a template from my server :


Ext.define('Media.view.media.View', {
extend: 'Ext.panel.Panel',
alias: 'widget.media.view',
layout: 'column',
id: 'media-view',
autoScroll: true,
defaultType: 'container',
loader:{
url: 'myserverurl.php',
autoLoad: false,
renderer: function(loader, response, active) {
var tpl = new Ext.XTemplate(response.responseText);
var targetComponent = loader.getTarget();
var dom = tpl.apply(targetComponent.model.getData());


return true;
}
}
}

My template is loaded, my datas are merged in my template and return me HTML string correctly.. Great !
But I have some stuff to do in my html before append it on my DOM page.
How can I transform my HTML string to an Ext.dom.Element in order to use a select(), destroy(), etc. method ?


Thanks !
CÚdric.

ettavolt
14 Oct 2013, 2:21 AM
Your template should contain all that display logic. If it needs some data other that targetComponent.model has, just merge it in and pass to template.

webid
23 Oct 2013, 12:59 AM
Your template should contain all that display logic. If it needs some data other that targetComponent.model has, just merge it in and pass to template.

Sure, you're right ..
In my targetComponent.model, I have other objects in arrays .. So, I have to duplicate parts of my HTML template to render these objects.

But I think, I'll load my targetComponent.model's template .. display these informations, then I will load children's template and render them .. I think it's the best way, but I must do two Ajax calls in order to load my two templates.

In my templates, I have any widgets (like accordions). How could I transform my HTML (<ul><li>...<.li></ul>) to Ext widgets automatically ? I don't find any help ..

Thank you !
CÚdric.
ps : I hope my English is not so bad ..

ettavolt
25 Oct 2013, 1:55 AM
Well, I believe you think ExtJS is some kind of HTML 'beautifier', like, say, jquery-mobile.
It is not actually. HTML and CSS are used just for 'displaying' purposes.
You should consider creating containers with some number of components and then update components state according to data. Note, it is better not to create a component for each display item and destory component when item is removed.