rundis/elm-bootstrap/3.0.0

NOTE: this package is not compatible with Elm 0.19.1

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.defaultValue "Hello"
    , 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"

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

defaultValue : String -> Option msg

Shorthand for setting the defaultValue attribute of an input

disabled : Bool -> Option msg

Shorthand for setting the disabled 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 (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

These options really only makes sense when used in conjunction with the form module. To use standalone, remember to wrap your inputs in a containing element and provide it one of the following classes:

  • has-success
  • has-warning
  • has-danger
success : Option msg

Option to add a success marker icon for your input.

Note: Please read the caveat described about validation options

warning : Option msg

Option to add a warning marker icon for your input.

Note: Please read the caveat described about validation options

danger : Option msg

Option to add a danger marker icon for your input.

Note: Please read the caveat described about validation options