vrimar / construct-ui

A Mithril.js UI library
https://vrimar.github.io/construct-ui
MIT License
287 stars 23 forks source link

Select attribute `value` does not affect which option is selected #52

Closed cmcaine closed 3 years ago

cmcaine commented 3 years ago

The docs and comments in the code say that value specifies which option is selected, but that doesn't seem to be true.

Small example:

import "construct-ui/lib/index.css";
import { Select } from "construct-ui";
import m from "mithril";

// calls itself recursively, re-rendering on each event.
const view = ({s1, s2, s3}) => {
  m.render(document.body,
    m("div",
      m(Select, {
        options: [1, 2, 3, 4],
        defaultValue: s1,
        onchange: (e) => {
          console.log({s1: e.currentTarget.value});
          view({s1: e.currentTarget.value, s2, s3})
        }
      }),
      m(Select, {
        options: [1, 2, 3, 4],
        value: s2,
        onchange: (e) => {
          console.log({s2: e.currentTarget.value});
          view({s1, s2: e.currentTarget.value, s3})
        }
      }),
      m('select', {
        value: s3,
        onchange: e => {
          console.log({s3: e.currentTarget.value});
          view({s1, s2, s3: e.currentTarget.value})
        }},
        [1, 2, 3, 4].map(v => m('option', {value: v}, v))),
    ))}

view({s1: 2, s2: 3, s3: 4})

Expected behaviour is that items selected from the dropdowns will stay selected. Actual behaviour is that both of the Select elements change to 1 and stay there. The manually written 'select' element works as intended.

cmcaine commented 3 years ago

Live example: https://codesandbox.io/s/construct-ui-example-forked-e9ztw?file=/src/index.js

cmawhorter commented 3 years ago

came here to report this issue is happening in the docs. at least i think it's the same issue.

Go here https://vrimar.github.io/construct-ui/#/components/select

Selecting works but the displayed/active value displayed never changes

vrimar commented 3 years ago

Fixed in v0.3.1. Thanks for the report!

cmcaine commented 3 years ago

Thank you!