Nested Templates Via Ajax

[jwynveen]

I ajax my templates in from a file. In the root template in that file, I'm trying to render a nested template with {{tmpl}} that is in the same file I ajaxed in. However, I get an error in FireBug that c.tmpl is not a function. It seems it can't find the second template in that file. Is there a way to get this working or is this a bug?

[BorisMoore]

Difficult to answer without knowing how you are 'ajaxing in' your templates. One way, which I would encourage, is to create a remote script file to load the templates as named templates, from strings:

Mytemplates.js:
$.template( "rowTemplate", “<tr>…</tr>” ); 
$.template( "liTemplate", “<li>…</li>” );

Then either include it statically, as <script src=”mytemplates.js” …> or use jQuery.getScript or equivalent to load dynamically. Render as named templates using $.tmpl("rowTemplate", data) or {{tmpl(data) "liTemplate"}}.

Can you test whether this approach works for you?

[jwynveen]

That method works. However, I found a more efficient way to do it. When I receive the html response from my ajax call that has all of the templates in it, I use $('script', response).each(..) to loop through every <script> tag in the file and create a named template for each based on their id attribute.