jQuery template select option

Question

How do I use jQuery templates to select an option?

Let's say my data is: { "color" : "red" }

I have :

<select>
  <option>blue</option>
  <option>green</option>
  <option>red</option>
</select>

I want red to be the one that's selected by default. How can I do this?

Thanks.

Answer 1

Maybe not the most elegant, but here is a way to do it in your template: http://jsfiddle.net/rniemeyer/z7Uu7/

<select>
    <option {{if color == 'blue'}}selected{{/if}}>blue</option>
    <option {{if color == 'green'}}selected{{/if}}>green</option>
    <option {{if color == 'red'}}selected{{/if}}>red</option>
</select>

Answer 2

$("select").val(data['color']);