DatePicker

View

datePicker : Options msg -> List (Attribute msg) -> State -> Maybe Date -> Html msg

DatePicker view function.

Example:

DatePicker.datePicker
        datePickerOptions
        [ class "my-datepicker" ]
        model.datePickerState
        model.value

type alias Options msg =

{ onChange : Maybe Date -> msg

, toMsg : State -> msg

, nameOfDays : NameOfDays

, firstDayOfWeek : Day

, formatter : Date -> String

, titleFormatter : Date -> String

, fullDateFormatter : Date -> String

}

Configuration of the DatePicker * onChange is the message for when the selected value in the multi-select is changed. (Required) * toMsg is the Msg for updating internal State of the DatePicker element. (Required) * nameOfDays is the configuration for name of days in a week. (Optional) * firstDayOfWeek is the first day of the week. (Optional) * formatter is the Date to String formatter for the input value. (Optional) * titleFormatter is the Date to String formatter for the dialog's title. (Optional) * fullDateFormatter is the Date to String formatter for the dialog's footer. (Optional)

defaultOptions : (Maybe Date -> msg) -> (State -> msg) -> Options msg

Default configuration.

Requires onChange and toMsg msgs. * nameOfDays see NameOfDays for the default values. * firstDayOfWeek Default: Sunday. (Optional) * formatter Default: "%m/%d/%Y" (Optional) * titleFormatter Default: "%B %Y" (Optional) * fullDateFormatter Default: "%A, %B %d, %Y" (Optional)

type alias NameOfDays =

{ sunday : String

, monday : String

, tuesday : String

, wednesday : String

, thursday : String

, friday : String

, saturday : String

}

Configuration for name of days in a week.

This will be displayed as the calendar's header. Default: * sunday = "Su" * monday = "Mo" * tuesday = "Tu" * wednesday = "We" * thursday = "Th" * friday = "Fr" * saturday = "Sa"

Initial

initialState : State

Initial state of the DatePicker

initialStateWithToday : Date -> State

Initial state of the DatePicker with today Date

initialCmd : (State -> msg) -> State -> Cmd msg

Initial Cmd to set the initial month to be displayed in the datepicker to the current month.

Internal State

type State

Opaque type to keep track of the DatePicker internal state

abadi199/elm-input-extra/4.2.2

DatePicker

View

Initial

Internal State

Modules