EdutainmentLIVE / elm-bootstrap / Bootstrap.Form.Input

This module allows you to create Bootstrap styled HTML 5 inputs.

Input types

text : List (Option msg) -> Html msg

Create an input with type="text"

Input.text
    [ Input.id "myinput"
    , Input.small
    , Input.onInput MyInputMsg
    ]

password : List (Option msg) -> Html msg

Create an input with type="password"

datetimeLocal : List (Option msg) -> Html msg

Create an input with type="datetime-local"

date : List (Option msg) -> Html msg

Create an input with type="date"

month : List (Option msg) -> Html msg

Create an input with type="month"

time : List (Option msg) -> Html msg

Create an input with type="time"

week : List (Option msg) -> Html msg

Create an input with type="week"

number : List (Option msg) -> Html msg

Create an input with type="number"

email : List (Option msg) -> Html msg

Create an input with type="email"

url : List (Option msg) -> Html msg

Create an input with type="url"

search : List (Option msg) -> Html msg

Create an input with type="search"

tel : List (Option msg) -> Html msg

Create an input with type="tel"

color : List (Option msg) -> Html msg

Create an input with type="color"

Options

id : String -> Option msg

Options/shorthand for setting the id of an input

small : Option msg

Option to make an input shorter (in height)

large : Option msg

Option to make an input taller (in height)

value : String -> Option msg

Shorthand for setting the value attribute of an input

disabled : Basics.Bool -> Option msg

Shorthand for setting the disabled attribute of an input

readonly : Basics.Bool -> Option msg

Shorthand for setting the readonly attribute of an input

onInput : (String -> msg) -> Option msg

Shorthand for assigning an onInput handler for an input

placeholder : String -> Option msg

Shorthand for setting the placeholder attribute of an input

attrs : List (Html.Attribute msg) -> Option msg

Use this function to handle any Html.Attribute option you wish for your input


type Option msg

Opaque type representing legal input configuration options

Validation

You can indicate success or invalid input using these functions.

success : Option msg

Option to add a success marker icon for your input.

danger : Option msg

Option to add a danger marker icon for your input.