PDA

View Full Version : how to loop through XML reader results and apply them to a template



heaversm
20 Jun 2011, 10:08 AM
Hi - I'm trying to follow the XML Reader API documentation here:

http://dev.sencha.com/deploy/touch/docs/?class=Ext.data.XmlReader

But I can't figure it out. I've successfully retrieved my XML feed, but I now want to loop through it and create html markup via a template. I see the .first() method works, but .each() does not. How do I accomplish this? Here's my code:



Ext.regModel('Work', {
fields: ['title', 'thumb', 'video']
});

var workStore = new Ext.data.Store({
model: 'Work',
proxy: {
type: 'ajax',
url : 'lib/xml/work_xml.xml',
reader: {
type: 'xml',
record: 'project'
}
}
});

t_work = new Ext.Component({
cls:'t_work', title:'Work',
title:'Work',
scroll: 'vertical',
tpl: new Ext.XTemplate(
'<tpl for=".">',
'<div class="work">',
'<h3 class="work_title">{title}</h3>',
'<div class="work_thumb">',
'<img src="{thumbnail}" alt="{title}"/>',
'</div>',
'</div>',
'</tpl>'
)
});

function loadWork(){
workStore.load({
callback: function(data) {
var project = workStore.first(); //this works, but how do I get each item in workStore?
t_work.update(project) //the model doesn't pass the data along properly
}
});
}

heaversm
20 Jun 2011, 11:04 AM
I figured out how to loop through the data - I feel like everything is being loaded properly, ,but my template is not parsing it correctly. This is my template:


t_work = new Ext.Component({
cls:'t_work', title:'Work',
title:'Work',
scroll: 'vertical',
tpl: new Ext.XTemplate(
'<tpl for="project">',
'<div class="work">',
'<h3 class="work_title">{title}</h3>',
'<div class="work_thumb">',
'<img src="{thumbnail}" alt="{title}"/>',
'</div>',
'</div>',
'</tpl>'
)
});

and this is how I loop through all the data:


function loadWork(){
workStore.load({
callback: function(data) {
var projects = data;
t_work.update(projects)
for (var i = 0, iln = projects.length; i < iln; i++){
console.log(projects[i].get('title'))
}
}
});
}

Why isn't the template generating the proper data?

heaversm
21 Jun 2011, 1:53 PM
guess I'll just use JQuery.