I am looking through some code where I successfully implemented a drop-down
menu, and it appears I wrote a custom event handler. "onInput" did not work
for me.
Here is the function that I wrote (Evt is an alias for Html.Events).
select : (String -> a) -> String -> List ( String, String ) -> Html a
select sendMsg selection options =
let
toOption ( value, label ) =
Html.option
[ Attr.selected (selection == value)
, Attr.value value
]
[ Html.text label ]
handler =
Evt.on "change" (Json.map sendMsg Evt.targetValue)
in
Html.select [ handler ] (List.map toOption options)
On Mon, Feb 27, 2017 at 6:53 AM, <[email protected]> wrote:
> I have been trying to use Html.select (the drop-down menu). Unfortunately
> the selected attribute doesn't seem to work for me.
> Some context: I am attempting the exercises at the bottom of
> https://guide.elm-lang.org/architecture/effects/http.html. As new topics
> are entered in the input box, they should be added to the drop-down menu.
> I found this would sporadically cause the menu selection to jump around, so
> I tried to handle it manually using the selected attribute.
> Anybody have any ideas how to do this so it works? The relevant piece
> of code looks something like this:
>
> view : Model -> Html Msg
> view model =
> div []
> [ input [ onInput ChangeTopic ] []
> , select [ onInput SelectTopic ]
> (List.map
> (makeOption model.selectedTopic)
> (Set.toList model.allTopics)
> )
> , button [ onClick MorePlease ] [ text "Go!" ]
> , img [ src model.gifUrl ] []
> ]
>
> makeOption : String -> String -> Html msg
> makeOption selectedTopic topic =
> option
> (if topic == selectedTopic then
> [ value topic, selected True ]
> else
> [ value topic ]
> )
> [ text topic ]
>
> --
> 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.
>
--
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.
