PDA

View Full Version : Compiled Templates not working as expected



pcbender
20 Oct 2006, 10:12 AM
The following code works:

var spec = {
tag: 'div',
style: 'width:100%;border:1px solid blue;',
cls: 'wtf',
children: [{
tag: 'a',
href: '{0}',
children: [{
tag: 'span',
html: '{1}'
}]
}]
};
var template = YAHOO.ext.DomHelper.createTemplate(spec);
template.compile();
var el = template.append(divToolbar, ['http://www.google.com', 'boo']);

However, this does not:

var spec = {
tag: 'div',
style: 'width:100%;border:1px solid blue;',
cls: 'wtf',
children: [{
tag: 'a',
href: '{myurl}',
children: [{
tag: 'span',
html: '{mytext}'
}]
}]
};
var template = YAHOO.ext.DomHelper.createTemplate(spec);
template.compile();
var el = template.append(divToolbar,
[
{'myurl' : 'http://www.google.com', 'mytext' : 'boo'}
]
);

The problem is in the generated code:

this.compiled = function(values){ return '<div><span>' + values[mytext] + '</span> (' + values[myurl] + ')</div>';};

As you can see, the myurl reference should be 'myurl'. Same for mytext.

Also not sure if that syntax should work. Shouldn't the gen'd code look something like:

values['children'][0]['myurl']

Anyway.

Thanks.

jack.slocum
20 Oct 2006, 11:33 AM
There's a patch in this thread that does actually as you described.

http://www.jackslocum.com/forum/viewtopic.php?t=266

pcbender
20 Oct 2006, 11:57 AM
Thanks for the info. I'm still not sure, even with using the ordinal approach, how you would specify multiple children's values. Again back to your example, how would you specify more than one link (a tag) as a child of the parent div?

Thanks,

PC

jack.slocum
20 Oct 2006, 12:37 PM
The template would be the child (a), without the parent.

pcbender
20 Oct 2006, 12:51 PM
Great work. Using the library for a project now. Donations on their way.

PC

jack.slocum
20 Oct 2006, 1:08 PM
That sounds great to me. :D