abadi199/elm-input-extra/5.2.4

NOTE: the latest version is 5.2.6

Input.Number

Number input

Options

type alias StringOptions msg =
{ maxLength : Maybe Int
, maxValue : Maybe Int
, minValue : Maybe Int
, onInput : String -> msg
, hasFocus : Maybe (Bool -> msg)
}

Options of the input component with String value.

  • maxLength is the maximum number of character allowed in this input. Set to Nothing for no limit.
  • maxValue is the maximum number value allowed in this input. Set to Nothing for no limit.
  • minValue is the minimum number value allowed in this input. Set to Nothing for no limit.
  • onInput is the Msg tagger for the onInput event.
  • hasFocus is an optional Msg tagger for onFocus/onBlur event.
type alias Options msg =
{ maxLength : Maybe Int
, maxValue : Maybe Int
, minValue : Maybe Int
, onInput : Maybe Int -> msg
, hasFocus : Maybe (Bool -> msg)
}

Options of the input component.

  • maxLength is the maximum number of character allowed in this input. Set to Nothing for no limit.
  • maxValue is the maximum number value allowed in this input. Set to Nothing for no limit.
  • minValue is the minimum number value allowed in this input. Set to Nothing for no limit.
  • onInput is the Msg tagger for the onInput event.
  • hasFocus is an optional Msg tagger for onFocus/onBlur event.
defaultStringOptions : (String -> msg) -> StringOptions msg

Default options for input with String value Params:

  • onInput (type: String -> msg) : The onInput Msg tagger

Value:

{ onInput = onInput
, maxLength = Nothing
, maxValue = Nothing
, minValue = Nothing
, hasFocus = Nothing
}
defaultOptions : (Maybe Int -> msg) -> Options msg

Default value for Options. Params:

  • onInput (type: Maybe Int -> msg) : The onInput Msg tagger

Value:

{ onInput = onInput
, maxLength = Nothing
, maxValue = Nothing
, minValue = Nothing
, hasFocus = Nothing
}

View

input : Options msg -> List (Attribute msg) -> Maybe Int -> Html msg

View function

Example:

type alias Model = { currentValue : Maybe Int }


type Msg = InputUpdated (Maybe Int) | FocusUpdated Bool


Input.Number.input
    { onInput = InputUpdated
    , maxLength = Nothing
    , maxValue = 1000
    , minValue = 10
    , hasFocus = Just FocusUpdated
    }
    [ class "numberInput"
    ...
    ]
    model.currentValue
inputString : StringOptions msg -> List (Attribute msg) -> String -> Html msg

View function for input with String value

Example:

type alias Model = { currentValue : String }


type Msg = InputUpdated String | FocusUpdated Bool


Input.Number.inputString
    { onInput = InputUpdated
    , maxLength = Nothing
    , maxValue = 1000
    , minValue = 10
    , hasFocus = Just FocusUpdated
    }
    [ class "numberInput"
    ...
    ]
    model.currentValue