Module: addon/components/sl-date-picker

Extends

  • ember/Component
  • module:mixins/sl-tooltip-enabled

Members

(inner) autoclose :Boolean

Whether or not to close the datepicker immediately when a date is selected

Type:
  • Boolean
Default Value:
  • true
Source:

(inner) calendarWeeks :Boolean

Whether or not to show week numbers to the left of week rows

Type:
  • Boolean
Default Value:
  • false
Source:

(inner) classNames :Array.<String>

Type:
  • Array.<String>
Source:

(inner) clearBtn :Boolean

When true, displays a "Clear" button at the bottom of the datepicker

If "autoclose" is also set to true, this button will also close the datepicker.

Type:
  • Boolean
Default Value:
  • false
Source:

(inner) daysOfWeekDisabled :Array|String

Days of the week that should be disabled

Values are 0 (Sunday) to 6 (Saturday). Multiple values should be comma-separated.

Type:
  • Array | String
Source:

(inner) disabled :Boolean

When true, the input field is disabled and the datepicker will never display

Type:
  • Boolean
Default Value:
  • false
Source:

(inner) endDate :Date|String

The latest date that may be selected; all later dates will be disabled

Type:
  • Date | String
Default Value:
  • null
Source:

(inner) forceParse :Boolean

Whether or not to force parsing of the input value when the picker is closed

When an invalid date is left in the input field by the user, the picker will forcibly parse that value, and set the input's value to the new, valid date, conforming to the given format.

Type:
  • Boolean
Default Value:
  • true
Source:

(inner) format :String

The date format

Combination of the following:

  • d, dd: Numeric date, no leading zero and leading zero, respectively
  • D, DD: Abbreviated and full weekday names, respectively
  • m, mm: Numeric month, no leading zero and leading zero, respectively
  • M, MM: Abbreviated and full month names, respectively
  • yy, yyyy: 2- and 4-digit years, respectively
Type:
  • String
Default Value:
  • 'mm/dd/yyyy'
Source:

(inner) helpText :String

The help text below the datepicker

Type:
  • String
Default Value:
  • null
Source:

(inner, nullable) inputElementId :String

The input field's id attribute

Used to expose this value externally for use in this component and when composing this component into others.

Type:
  • String
Default Value:
  • null
Source:

(inner, nullable) inputs :Array

A list of inputs to be used in a range picker

The inputs will be attached to the selected element. Allows for explicitly creating a range picker on a non-standard element.

Type:
  • Array
Default Value:
  • null
Source:

(inner) keyboardNavigation :Boolean

Whether or not to allow date navigation by arrow keys

Type:
  • Boolean
Default Value:
  • true
Source:

(inner) label :String

The label text above the datepicker's input field

Type:
  • String
Default Value:
  • null
Source:

(inner) language :String

The IETF code of the language to use for month and day names

Type:
  • String
Default Value:
  • 'en'
Source:

(inner) layout :Object

Type:
  • Object
Source:

(inner) minViewMode :String

Set a limit for the view mode; accepts "days", "months", or "years"

Type:
  • String
Default Value:
  • 'days'
Source:

(inner) multidate :Boolean|Number

Enable multidate picking

Each date in month view acts as a toggle button, keeping track of which dates the user has selected in order. If a number is given, the picker will limit how many dates can be selected to that number, dropping the oldest dates from the list when the number is exceeded. true equates to no limit. The input’s value (if present) is set to a string generated by joining the dates, formatted, with multidateSeparator.

Type:
  • Boolean | Number
Default Value:
  • false
Source:

(inner) orientation :String

A space-separated string for the popup's anchor position

Consists of one or two of "left" or "right", "top" or "bottom", and "auto" (may be omitted).

Type:
  • String
Default Value:
  • 'auto'
Source:

(inner, nullable) placeholder :String

The placeholder text that the datepicker should show

Type:
  • String
Default Value:
  • null
Source:

(inner) startDate :Date|String

The earliest date that may be selected; all earlier dates will be disabled

Type:
  • Date | String
Default Value:
  • null
Source:

(inner) startView :String

The view that the datepicker should show when it is opened; accepts "month", "year", or "decade"

Type:
  • String
Default Value:
  • 'month'
Source:

(inner) todayBtn :Boolean|String

When true or "linked", displays a "Today" button at the bottom of the datepicker to select the current date

If true, the "Today" button will only move the current date into view. If "linked", the current date will also be selected.

Type:
  • Boolean | String
Default Value:
  • false
Source:

(inner) todayHighlight :Boolean

Whether to highlight the current date or not

Type:
  • Boolean
Default Value:
  • false
Source:

(inner, nullable) value :String

The date either selected by the datepicker or entered by the user

Type:
  • String
Default Value:
  • null
Source:

(inner) weekStart :Number

Day of the week to start on; 0 (Sunday) to 6 (Saturday)

Type:
  • Number
Default Value:
  • 0
Source:

Methods

(inner) options() → {Object}

Datepicker plugin options

Source:
Returns:
Type
Object

(inner) setInputElementId() → {undefined}

Captures and sets the input field's id attribute.

This is used to expose this value externally for use when composing this component into others.

Source:
Listens to Events:
  • event:didInsertElement
Returns:
Type
undefined

(inner) setupDatepicker() → {undefined}

Setup the bootstrap-datepicker plugin and events

Source:
Listens to Events:
  • event:didInsertElement
Returns:
Type
undefined

(inner) unregisterEvents() → {undefined}

Remove events

Source:
Listens to Events:
  • event:willClearRender
Returns:
Type
undefined

(inner) updateDateRange() → {undefined}

Dynamically update the startDate and endDate values for the datepicker

Source:
Observes:
  • endDate, startDate
Returns:
Type
undefined