Compiled Templates not working as expected

[pcbender]

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]

There's a patch in this thread that does actually as you described.

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

[pcbender]

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]

The template would be the child (a), without the parent.

[pcbender]

Great work. Using the library for a project now. Donations on their way.

PC

[jack.slocum]

That sounds great to me. :D