Rob Cannon
Rob Cannon

Reputation: 392

Iterating over an array in an ExtJS Template

I am using ExtJS to apply a set of data from a AJAx call to an Ext.Template. One of the elements is an array of strings.

var data = {
  name: "I am Here!",
  messages: ['aaa', 'bbb', 'ccc', 'ddd']
};

I've defined the template like this

var tpl = new Ext.Template(
  '<h2>{name}</h2>',
  '<tpl for="{messages}">',
    '<p>{.}</p>',
  '</tpl>'
);

When I apply this template to the data, it shows the {.} literally instead of printing each element. Most of the searches I have done for using arrays in in ExtJS use this format. Here is the JFiddle http://jsfiddle.net/u4zkM/2/

What is wrong with the way I am trying to use the array?

Upvotes: 0

Views: 2206

Answers (1)

zeke
zeke

Reputation: 3663

For arrays and other advanced functionality you need to use Ext.XTemplate. Also remove the brackets around messages.

var tpl = new Ext.XTemplate(
    '<h2>{name}</h2>',
    '<tpl for="messages">',
        '<p>{.}</p>',
    '</tpl>'
);

jsFiddle

Upvotes: 2

Related Questions