bluedogtraining / bdt-elm / Form.FloatInput

This module is useful if you want to add an Integer based Input element to your app.

Initialise and update


type Model

Add a Input.Model to your model.

type alias MyModel =
    { myInput : Input.Model
    }

init : Model

Add a Input.Model to your model.

myInitialModel : MyModel
myInitialModel =
    { myInput = Input.init -- optionally pipe into State Setters
    }


type alias Msg =
Internal.Msg

Add a Input.Msg to your Msg.

type MyMsg
    = UpdateMyInput Input.Msg

update : Msg -> Model -> Model

Use in your update function.

myUpdate : Msg -> Model -> ( Model, Cmd Msg )
myUpdate msg model =
    case msg of
        UpdateMyInput inputMsg ->
            { model | myInput = Input.update inputMsg mode.myInput } ! []

View and render

view : Model -> View

Transform an Input.Model into an Input.View, which allows us to pipe View Setters on it.

myView : Model -> Html Msg
myView model =
    div
        []
        [ Input.view model.myInput -- pipe view setters here, for example |> setIsLocked 'your logic here'
        ]

render : View -> Html.Styled.Html Msg

Transforms an Input.View into Html Input.Msg

myView : Model -> Html Msg
myView model =
    div
        []
        [ Input.view model.myInput
            |> Input.render
            |> Html.map UpdateMyInput
        ]

State Setters

reInitialise : Model -> Model

ReInitialise your FloatInput.Model.

reset : Model -> Model

Reset your FloatInput.Model.

setInitialValue : Basics.Float -> Model -> Model

Set the initial value of your FloatInput.Model.

setValue : Basics.Float -> Model -> Model

Change the value of your FloatInput.Model.

setDecimal : Basics.Int -> Model -> Model

Change the number of decimal places of your FloatInput.Model.

View Setters

setPlaceholder : String -> View -> View

Set a placeholder for your input.

setMaxLength : Basics.Int -> View -> View

Set the max length for your input string.

setIsError : Basics.Bool -> View -> View

Set whether your input is in error mode (red border).

setIsLocked : Basics.Bool -> View -> View

Set whether your input is locked (disabled).

setId : String -> View -> View

Give your input an id. Can be useful for DOM selectors (focus, WebComponents etc.)

Getters

getInitialValue : Model -> Maybe Basics.Float

Get the initial value of your input.

getValue : Model -> Maybe Basics.Float

Get the current value of your input. This is what you'd use to display the data somewhere outside of your input, or to send the data to the backend for example etc.

getIsChanged : Model -> Basics.Bool

Whether your input was changed. Useful if you want to disable save buttons unless there were changes etc.

getId : View -> Maybe String

Useful if you need the id of the input in your update function, so set focus etc.