PDA

View Full Version : XTemplate xkey not working



benshort
19 Oct 2012, 10:21 AM
Hi,

I have the following json


{ "timestamp": 1318781876406,
"services":[
{
"SD":"1000",
"ED":"1010",
"DS":"Destination",
"OC":"X01",
"CP":"Stop 1, Stop 2, Stop 3"
},
{
"SD":"1030",
"ED":"1045",
"DS":"Destination",
"OC":"X02",
"CP":"Stop 1, Stop 2, Stop 3"
}
]
}

which I decode using Ext.decode. I then use the XTemplate's overwrite method to update a panel. The XTemplate code is as follows.


'<div>', '<h1>Services</h1>',
'<p >',
'<tpl for="services">',
'<tpl foreach=".">',


'{[xindex]},',
'{[xkey]}<br>',


'</tpl>',
'</tpl>',
'</p>',
'</div>'

What I expect to see is:

1, SD
2, ED
3, DS
4, OC
5, CP

But what I actually see is:

1,

Commenting out
'{[xkey]}<br>', gives:

1, 2,

Not sure what's going wrong. Anyone got any ideas?

skirtle
20 Oct 2012, 11:39 AM
You may need to upgrade. I think foreach support was only added in 4.1.2, maybe 4.1.1.

With earlier versions you can simulate it using the {%...%} syntax to insert a JavaScript for/in loop.

burnnat
20 Oct 2012, 11:45 AM
This looks like a bug in ExtJS. I copied-and-pasted your template and data into a simple test:

var t = new Ext.XTemplate(
'<div>',
'<h1>Services</h1>',
'<p>',
'<tpl for="services">',
'<tpl foreach=".">',
'{[xindex]},',
'{[xkey]}<br>',
'</tpl>',
'</tpl>',
'</p>',
'</div>'
);

t.overwrite(Ext.getBody(), {
"timestamp": 1318781876406,
"services":[
{
"SD":"1000",
"ED":"1010",
"DS":"Destination",
"OC":"X01",
"CP":"Stop 1, Stop 2, Stop 3"
},
{
"SD":"1030",
"ED":"1045",
"DS":"Destination",
"OC":"X02",
"CP":"Stop 1, Stop 2, Stop 3"
}
]
});

Running this under Ext 4.1.0 and 4.1.1 only shows "1," like you say. However, running it under ExtJS 4.1.2 gives the proper output, so it would appear to be fixed as of version 4.1.2.

EDIT: Skirtle got his post in a few minutes before me, and of course he's absolutely correct. :)