How to iterate over an array of objects with jquery templates each command

Question

In Javascript I have a User object that contains an array of department objects like so:

user = 
{
   departments: [
        {id: 1, name: 'Department 1'},
        {id: 2, name: 'Department 2'},
        {id: 3, name: 'Department 3'}
   ]
}

Using jquery templates (version 1.4.2) I want to render a <select> tag like so:

<select name="departmentId" id="department">
    {{each departments}}
        <option value="{{= id }}">{{= name }}</option>
    {{/each}}   
</select>

This doesn't produce any values in the option elements. How do access the id and name properties of each of the department objects with the template.

Amended question so it no longer says "doesn't work" but explains that the code doesn't produce values in the option elements — Simon Lomax
– Simon Lomax, Commented Apr 1, 2012 at 16:37

Danish · Accepted Answer · 2012-04-27 12:02:18Z

7

Use it like

<select name="departmentId" id="department">
{{each departments}}
    <option value="${idField}">${textField}</option>
{{/each}}</select>

answered Apr 27, 2012 at 12:02

Danish

7041 gold badge8 silver badges16 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to iterate over an array of objects with jquery templates each command

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related