On Slack i was advised to use Html.Keyed and that fixed it Thanks so much Simon
On Tuesday, 16 August 2016 18:50:15 UTC+2, Wouter In t Velt wrote: > > My guess would be that this behavior is caused by changing from 3 to 2 > options while doing the first selection. > > Chrome Inspector doesn't even show me the "selected" attribute. > But with a static list of 3 items it works as expected > (change your view function to below to see) > view model = > select > [ onInput Switch ] <| > [ option [ value "1" > , selected <| model == Just "1" > ] [ text "one" ] > , option [ value "2" > , selected <| model == Just "2" > ] [ text "two" ] > , option [ value "3" > , selected <| model == Just "3" > ] [ text "three" ] > ] > > > My gut feel is that the virtual DOM diff engine is messing things up: on > the second render, elm knows you now have 2 instead of 3 options, but elm > does NOT know which of the original option has gone. > You may want to check out Html.keyed, which is introduced specifically to > tackle this. > http://package.elm-lang.org/packages/elm-lang/html/1.1.0/Html-Keyed > > I copied the refactored code (with keyed) below. not sure if it solves > your issue though. > Unfortunately, Elm-try does not recognize Html.keyed (yet). > module Test exposing (..) > > import Html exposing (..) > import Html.Keyed as Keyed > import Html.App as App > import Html.Attributes exposing (..) > import Html.Events exposing (..) > > import List exposing (map) > import Json.Decode as Json > > type alias Model = > Maybe String > > init = Nothing > > type Msg > = Switch String > > update (Switch s) model = > Debug.log"" <| Just s > > view model = > let > kvs = > [ ("1", "One") > , ("2", "Two") > ] > -- makeOpts now returns List (String, Html Msg) to use in Html. > keyed > makeOpts lst selectedKey = > lst > |> map (\(k, v) -> > (k, option > [ value k > , selected <| k == selectedKey > ] [ text v ]) > ) > in > Keyed.node "select" > [ onInput Switch ] <| > case model of > Just s -> > makeOpts kvs s > Nothing -> > makeOpts > (("0", "Zero") :: kvs) > "0" > > main = App.beginnerProgram > { model = init > , view = view > , update = update > } > > > > > -- You received this message because you are subscribed to the Google Groups "Elm Discuss" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. For more options, visit https://groups.google.com/d/optout.
