Internet Explorer dynamically added select elements display first option by default #2983
Comments
fergaldoyle
changed the title
|
Doing some local debugging, I found changing this line: vue/src/directives/public/model/select.js Line 42 in 3e1d70e to: this.vm.$nextTick(this.forceUpdate);
Solved the issue. From what I can see it doesn't break existing functionality. A separate but related issue (in IE) is when a select element is moved (either the element itself or when it's a descendant of a moved element) within the DOM, even with the above code change, it will reset and present the same issue as above (displaying the first option instead of a blank). <div id="move">
<label> Test
<select v-model="selected">...</select>
</label>
</div>
<div id="dest"></div>document.querySelector('#dest').appendChild(document.querySelector('#move')); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
http://codepen.io/anon/pen/gMbPrj
Visit the above page in IE11 and you'll see two select boxes, both with empty initial values which is what we expect.
Click the
showbutton to display two more select boxes (identical to the first two, but inside a v-if) and they will have initial values ofAAA, which is bad.Also the select element which is inside the
testcomponent gets an initial value ofAAA. It seems that the select element needs to be in the DOM during page load for it work as expected. Anything added dynamically (inside a v-if or through component templates) gets an initial value which takes it out of sync of the underlying model.I believe this happens only on Windows 8 & 10 (the select element is different from older versions of Windows).
The text was updated successfully, but these errors were encountered: