views:

43

answers:

3

I am using jtemplates with jquery and getting an error when I try to use tables in the template.

Following is working

<ul>
 {#foreach $T as record}
 <li>{$T.record.FirstName}</li>
 {#/for}
</ul>

but the following does not work and gives error $T.record is undefined in firebug

<table border="1">
{#foreach $T as record}
<tr>
 <td>{$T.record.FirstName}</td>
</tr>
{#/for}
</table>

Following is how I am calling template with some data

$(document).ready(function() {
    var data = [
                  { ID: 1, FirstName: 'Anne', Email: '[email protected]' },
                  { ID: 2, FirstName: 'Amelie', Email: '[email protected]' },
                  { ID: 3, FirstName: 'Polly', Email: '[email protected]' },
                  { ID: 4, FirstName: 'Alice', Email: '[email protected]' },
                  { ID: 5, FirstName: 'Martha', Email: '[email protected]' }
               ];

    $("#jTemplateDemo").setTemplate($("#templateHolder").html());
    $("#jTemplateDemo").processTemplate(data);
});

Any help in resolving this is greatly appreciated.

A: 

I'll take a stab at it, give this a try:

{#template MAIN}
<table border="1">
    <tr>
        <th>First Name</th>
        <th>Email</th>
    </tr>
    {#foreach $T as record}
        {#include ROW root=$T.record}
    {#/for} 
</table>
{#/template MAIN}

{#template ROW}
    <tr>
        <td>{$T.FirstName}</td>
        <td>{$T.Email}</td>
    </tr>   
{#/template ROW}

If you are still having trouble I would recommend that you put the template in an external html file and use it like this:

$("#jTemplateDemo").setTemplateURL('JTemplates/yourTemplateHere.html');
$("#jTemplateDemo").processTemplate(data);
Randall Kwiatkowski
Thanks Randall. I am seeing the results correctly in IE 8 but not in Firefox and chrome. Any ideas why that might me.
Check my updated answer. Also are there any errors in Firefox and Chrome?
Randall Kwiatkowski
A: 

The error was coming due to my placement of template itself. When I placed the template in a block like this

<script id="templateHolder" type="text/html">
    <!-- Template itself -->
</script>

templates rendered correctly.

A: 

I'm having the same problem. As user198552 I get wrong list orders in chrome 7.0.517.41 but IE 8 (8.0.7600.1685) and Firefox v3.6.11 are working fine.

I have the template on a separate file and the template is rendered on a div.

There are no javascripts error in chrome.

Any idea?

J. Morris