Skip to content

Instantly share code, notes, and snippets.

@joanllenas
Created July 18, 2018 18:37
Show Gist options
  • Save joanllenas/e606c34473c201ae46a237c0080aa54d to your computer and use it in GitHub Desktop.
Save joanllenas/e606c34473c201ae46a237c0080aa54d to your computer and use it in GitHub Desktop.
Controlled number input with Floats in Elm - the problem
module Main exposing (..)
import Html exposing (..)
import Html.Attributes as Attrs exposing (..)
import Html.Events exposing (..)
type Msg
= SetPrice String
type alias Model =
{ price : Float }
model : Model
model =
{ price = 0 }
update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
case msg of
SetPrice price ->
( { model | price = price |> String.toFloat |> Result.withDefault 0 }
, Cmd.none
)
view : Model -> Html Msg
view model =
div []
[ Html.form []
[ label [] [text "Price"]
, input [placeholder "Price", value (toString model.price), onInput SetPrice ] []
, br [] []
, p [] [ text ("Price is: " ++ (toString model.price)) ]
]
]
main : Program Never Model Msg
main =
Html.program
{ init = ( model, Cmd.none )
, update = update
, subscriptions = \_ -> Sub.none
, view = view
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment