Well i have the data returned from PHP which i then parse it. Data shows up for the attribute called empName but not for the nested ones. What is wrong that i need to correct in my javascript code. Heres the JSON string which returns from PHP (the output of variable called info):
[{"empName":"Sam","skillDetails":[{"skill":"Javascript","level":"Intermediate"}]}]
And here' s the template (The data does not show for skill and level)
<script id="tmplEmpDetails" type="text/x-jsrender">
{{if data.length > 0}}
{{for data}}
<tr>
<td class="tg-spn1">{{:#view.data.empName}}</td>
<td class="tg-spn1">{{:#view.data.skillDetails.skill}}</td>
<td class="tg-spn1 ">{{:#view.data.skillDetails.level}}</td>
</tr>
{{/for}}
{{/if}}
</script>
The Javascript:
$.post( "indexBase.php",
$('#str').val(JSON.stringify(empObj)),
function(info){
var result = JSON.parse(info);
$( "#tblEmpDetails tr[id!='hdrEmpDetails']" ).empty();
$("#tblEmpDetails").append($("#tmplEmpDetails").render({
data : result
}));
});
$("#mainForm").submit( function() {
return false;
});
$('.trSkillCls').not(':first').remove();
});
And finally the HTML (Sure i need to correct my HTML too)
<table class="tg" width="100%" id="tblEmpDetails">
<tr id="hdrEmpDetails">
<th class="tg-s6z2" >Employee</th>
<th class="tg-s6z2" >Skill</th>
<th class="tg-s6z2" >Level</th>
</tr>
</table>
Does that mean i have to for loop twice in my template?