Get parent in loop inside loop - Xtemplate [Archive]

healthformula

30 Jul 2012, 5:44 PM

I am trying to generate table with XTemplate but unfortunately with data that I have it is not working. Can somebody please give me some insight.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Template</title>
<link href="stylesheets/ext-all.css" rel="stylesheet" type="text/css">

</head>
<script type="text/javascript" src="http://cdn.sencha.io/ext-4.1.1-gpl/ext-all.js"></script>
<script type="text/javascript">
var dt =
{
dayNames: ['M','T','W','T','F','S','S'],
months: new Array(2)
};

Ext.onReady(function()
{
var tpl = new Ext.XTemplate
(
'<div id="picker">',
'<tpl for="months">',
'<div>Month</div>',
'<tpl for="parent.dayNames">',
'<div>Days</div>',//This is not working ??? why
'</tpl>',
'</tpl>',
'<tpl for="dayNames">',
'<div>Days</div>',//This is working
'</tpl>',
'</div>'
);
tpl.overwrite(Ext.getBody(), dt);
});
</script>
<body>
</body>
</html>

vietits

30 Jul 2012, 7:13 PM

Try the following solutions with Ext 4.1.1:
1. Solution 1:

<script type="text/javascript">
var dt =
{
dayNames: ['M','T','W','T','F','S','S'],
//months: new Array(2)
months: [0,0] // initialize months with an array with values that are not null
};

Ext.onReady(function()
{
var tpl = new Ext.XTemplate
(
'<div id="picker">',
'<tpl for="months">',
'<div>Month</div>',
'<tpl for="parent.dayNames">',
'<div>Days</div>', //This is now working
'</tpl>',
'</tpl>',
'<tpl for="dayNames">',
'<div>Days</div>',//This is working
'</tpl>',
'</div>'
);
tpl.overwrite(Ext.getBody(), dt);
});
</script>

2. Solution 2: Use nested for

<script type="text/javascript">
var dt =
{
dayNames: ['M','T','W','T','F','S','S'],
months: new Array(2)
};

Ext.onReady(function()
{
var tpl = new Ext.XTemplate
(
'<div id="picker">',
'<tpl for="months">',
'<div>Month</div>',
'<tpl for="..">', // back to parent scope
'<tpl for="dayNames">',
'<div>Days</div>',
'</tpl>',
'</tpl>',
'</tpl>',
'<tpl for="dayNames">',
'<div>Days</div>',//This is working
'</tpl>',
'</div>'
);
tpl.overwrite(Ext.getBody(), dt);
});
</script>

healthformula

31 Jul 2012, 6:02 AM

Thank you vietits for your help. I went with option number 2. Once again thank you very much.