PDA

View Full Version : Is is possible to display a list within an XTemplate ?



slmd
26 Dec 2011, 7:19 AM
Hi!
I have a list that uses an XTemplate to display data depending on the result of functions that has been setted within the XTemplate. In one of those functions, i need to list data from the localstorage. In other terms it means that the XTemplate that is called by a list will render another list. Here is some code :



var myTemplate = new XTemplate(
'<tpl for=".">'+
'<tpl if="this.myfunc()">'+
'<div id="add_result"></div>'+
'</tpl>'+
'</tpl>',
{
compiled : true,

myfunc : function() {

var add_result = "<h1>Results</h1>";
document.getElementById('add_result').innerHTML = add_result;

var insideList = new Ext.List({
id : 'insideList',
itemTpl : '<tpl for=".">{field_data_to_display}</tpl>',
store : myLocalStorage_Store
})
return true
}
}
);


var mainList = new Ext.List({
id : 'mainList',
itemTpl : myTemplate,
store : myStore
})


I want the llist to appear right after the "add_result" tag. My problem is i can't display this list therefore i am wondering, How can i achieve this?

Thank you!

mitchellsimoens
26 Dec 2011, 8:12 AM
You can use renderTo to render a component within any element. The trick with XTemplate is to know how to target the element you want.

slmd
26 Dec 2011, 9:32 AM
i've used the following code but i can' managed to make it work. The list is not appearing


var myTemplate = new XTemplate(
'<tpl for=".">'+
'<tpl if="this.myfunc()">'+
'<div id="add_result"></div>'+
'</tpl>'+
'</tpl>',
{
compiled : true,

myfunc : function() {

var add_result = "<h1>Results</h1>";
document.getElementById('add_result').innerHTML = add_result;

var insideList = new Ext.List({
id : 'insideList',
itemTpl : '<tpl for=".">{field_data_to_display}</tpl>',
store : myLocalStorage_Store,
renderTo : 'add_result' //i've added this
})
return true
}
}
);