mithril.js: Select doesn't work in Mithril in IE browser

Mithril version: I don’t know version of Mithril, because this version doesn’t contain m.version. But I looked commits and this Mithril version has been added in 1 Jul 2015.

When I choose option in IE(10, 11), selected value doesn’t show. Field of selector is empty. In other browsers it works correctly.

View generation:

m "select.selector", {
  disabled: !ctrl.overrideLocales(),
  value: ctrl.locale(),
  onchange: m.withAttr("value", ctrl.locale)
},
[mapArray(locales)]

mapArray method:

view : (ctrl) ->
  mapArray = (arr) ->
    m "option", [val.name ? val] for val in arr

If I paste attribute selected to option element in Developer Tools, it’s displayed correctly in IE browser. But mithril doesn’t allow me to insert this attr to element.

About this issue

Original URL
State: closed
Created 8 years ago
Comments: 16 (12 by maintainers)

Most upvoted comments

@gyandeeps Works in IE11/Edge, nice catch 👍

https://jsbin.com/girulokepu/1/edit?js,output

@Grinv Looks like for IE you need to add specific values to each <option>, otherwise setting a value on the <select> won’t do what you expect.

tivac on Mar 14, 2016

@barneycarroll If you’re okay with it, feel free to add that section yourself. 😃

On Mon, Mar 14, 2016, 14:58 Barney Carroll notifications@github.com wrote:

Hey guys, this is one of those DOM gotchas that often end up being assumed to be a Mithril bug because Mithril abstracts away the DOM API. How about adding a section to the wiki to document good old DOM gotchas? The problems are usually well documented elsewhere, so this could end up really easy and useful for people to see (maybe in the issue submission template?) if their perceived Mithril DOM issue was actually a real DOM issue…

— Reply to this email directly or view it on GitHub https://github.com/lhorie/mithril.js/issues/980#issuecomment-196472068.

dead-claudia on Mar 15, 2016

Here is the solution:

m.render(
    document.body,
    m("select", { value : "Two" },
        m("option", { value : "One" }, "One"),
        m("option", { value : "Two" }, "Two")
    )
)

I think i have seen this happen with IE regardless if you use mithril or not. I think IE needs value property on options.

gyandeeps on Mar 14, 2016