Created
July 18, 2018 18:37
-
-
Save joanllenas/e606c34473c201ae46a237c0080aa54d to your computer and use it in GitHub Desktop.
Controlled number input with Floats in Elm - the problem
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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