(and Attr is an alias for Html.Attributes) On Mon, Feb 27, 2017 at 10:16 AM, Nick H <[email protected]> wrote:
> 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.
