mardi 24 janvier 2017

How can I dynamically set the `selected` attribute on an `` tag?

The Ember guide on binding data attributes says that "If you use data binding with a Boolean value, it will add or remove the specified attribute." I'm trying to use this feature to dynamically set the selected attributes on <option>s. I'm finding that I can dynamically set the disabled attribute, but the selected attribute is always omitted, no whether the boolean is true or false.

Given this handlebars template:

<option disabled=false selected=false>One</option>
<option disabled=true selected=true>Two</option>

I get the following HTML:

<option>One</option>
<option disabled>Two</option>

Why doesn't selected=true produce a selected attribute in the rendered output?


To give a bit more context, I'm following this article on How to do a select in Ember 2.0. Using the method described in that article, I can successfully update the data in the controller when the select onchange event fires, but the DOM doesn't update to reflect the change.

I've put together this ember-twiddle, which includes two select elements. One uses select=, which doesn't work the way I want it to. The other uses a long-hand ......, which does work but looks terrible.




Aucun commentaire:

Enregistrer un commentaire