Missing ref values for select / options #2629
When creating a select input with options, if the value attribute is not present, riot will use the text content of the option as the value. However, when generating options using a Key/Value pair (or something similar), Riot will not create the "value" attribute of an option with a "falsey" value.
In the plnkr link below, the generated DOM looks like
<select ref="selected"> <option value="H">Home</option> <option value="R">Road</option> <option>All Locations</option> </select>
But the expected behavior (in my opinion) should be more similar to this:
<select ref="selected"> <option value="H">Home</option> <option value="R">Road</option> <option value="">All Locations</option> </select>
If you are using this value to look up an object in your array,
Chrome, Safari, Firefox
The text was updated successfully, but these errors were encountered:
Ha! Had run into it also. Never took the time to send a pr though...
You are a victim of #1642, or should I say the implementation of the "solution". On creation, riot does add the
It's an easy fix.
Somewhere in the riot code in
Change that line so it will skip the tagName ==='OPTION'.
That's all to it. Tests pass, even the stupid
@GianlucaGuarini just thought of a caveat in this pr.
Please keep in mind that this pr only checks for
Its up to you to create a list of exceptions where ever you see fit in the riot code, in order to exclude these as well.
The option specs are really clear:
@GianlucaGuarini you are wrong.
(if there is one attribute)
(not if the value of the attribute is emtpy string!)
If there is an empty string in the attribute its a perfectly fine value. This is why if you inspect the element you can see
The empty string IS a value.
Its is, indeed, pretty clear.
This is the markup rendered on Firefox in the first "buggy" example provided, the empty option value is set properly like expected using a riot loop. I don't see where is the bug here am I missing something else?
Basically the "expected" and the "buggy" examples render exactly the same markup.