Skip to content

Instantly share code, notes, and snippets.

@koolquark
Created July 23, 2019 04:37
Show Gist options
  • Save koolquark/d7ff618c50d3f194b9be93b851cedc6b to your computer and use it in GitHub Desktop.
Save koolquark/d7ff618c50d3f194b9be93b851cedc6b to your computer and use it in GitHub Desktop.
Elm select list - updated to 0.19
-- See https://stackoverflow.com/questions/37376509/work-with-elm-and-select
-- Modified for Elm 0.19
import Html exposing (..)
import Html.Events exposing (on)
import Html.Attributes exposing (..)
import Json.Decode as Json
import String
import Html.Events.Extra exposing (targetValueIntParse)
import Browser exposing (sandbox)
main =
sandbox { init = { duration = 1}, view = view, update = update }
durationOption duration =
option [ value (String.fromInt duration) ] [ text (String.fromInt duration) ]
view : Model -> Html Msg
view model =
Html.div []
[ h2 [] [ text "Month selector" ]
, select [ on "change" (Json.map SetDuration targetValueIntParse) ]
(List.map durationOption (List.range 1 12))
, div [] [ text <| "Selected: " ++ (String.fromInt model.duration) ]
]
type Msg
= SetDuration Int
type alias Model =
{ duration : Int }
update msg model =
case msg of
SetDuration val ->
{ model | duration = val }
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment