Class: UWA.Controls.DatePicker

UWA/Controls/DatePicker. UWA.Controls.DatePicker

new UWA.Controls.DatePicker(options)

The DatePicker component is designed to provide date or date range picker control.

Available Events
Event Description
onDateSelect Triggered when a Date has been selected by the user (argument is the Date object)
onChange Triggered when a Date has been selected by the user (argument is the value of the input)
Examples

Example 1: Setup a date picker

var datePicker = new UWA.Controls.DatePicker({
    type: 'date',
    format: '%e %b %Y'
}).addEvent('onDateSelect', function (date) {
    // Do someting with date
}).inject(container);

Example 2: Setup a date picker from an existing input element

var datePicker = new UWA.Controls.DatePicker({element: input}).inject(form);

// Do something on form submit
// (you can alternatively handle the 'onDateSelect' DatePicker event)
form.addEvent('submit', function (e) {
    var timestamp = input.value;
    // ...
    UWA.Event.preventDefault(e);
});
Parameters
Name Type Description
options Object

Options hash or a option/value pair.

Properties
Name Type Argument Default Description
format String <optional>
 ''

Date format to use to display the current date value
calendarOptions String <optional>
 ''

Calendar options such as 'limit'
button Element <optional>

A DOM element or descriptor to display the button
time Boolean <optional>

hether the datepicker should ask for the time after setting the date
utc String <optional>
 ''

Whether ask for an UTC date or a local date.

Extends

Index

Members

Methods

Members

<protected> name

Properties:
Name Type Description
name String

The Calendar name. Default: 'uwa-datepicker'

<protected> options

Properties:
Name Type Description
defaultOptions Object

The default controls options.

<protected> _hiddenInput

Properties:
Name Type Description
_hiddenInput Boolean

If the input element should be displayed or emulated with some generated DOM. Default: false.
Inherited From:

<protected> elements :Object

The current control elements.

Type
  • Object
Inherited From:

Methods

buildNavigationItem()

Overrides <UWA.Controls.Picker.buildNavigationItem>

setDate(date) → {this}

Set current date.

Parameters
Name Type Description
date Date
Returns
Type
this

getDate() → {Date}

Get the current date.

Returns
Type
Date

buildSkeleton()

Overrides UWA.Controls.Input.buildSkeleton.

Inherited From:

buildNavigation() → {Element}

Build the navigation menu.

Returns

Element or Element descriptor. The navigation menu.

Type
Element
Inherited From:

isOpen() → {Boolean}

Returns

true if the dropdown is open.

Type
Boolean
Inherited From:

focus()

Overrides <UWA.Controls.Input.focus>

Inherited From:

open() → {this}

Open the dropdown

Returns
Type
this
Inherited From:

close() → {this}

Close the dropdown

Returns
Type
this
Inherited From:

toggle(f) → {this}

Toggle the dropdown

Parameters
Name Type Description
f Boolean

If defined, opens (true) or closes (false) the dropdown
Returns
Type
this
Inherited From:

onClick()

Default onClick handler

Inherited From:

onClose()

Default onClose handler

Inherited From:

onNavigationClick()

Default onNavigationClick handler

Inherited From:

buildInput() → {DOMElement}

Build the native input element. To override.

Returns

The native input element

Type
DOMElement
Inherited From:

isDisabled() → {Boolean}

Get if this input is disabled

Returns
Type
Boolean
Inherited From:

setDisabled(y) → {this}

Set the input as disabled

Parameters
Name Type Argument Default Description
y Boolean <optional>
 true

If false, enable the input.
Returns
Type
this
Inherited From:

getValue() → {String}

Get the input value. To override if needed.

Returns

The input value

Type
String
Inherited From:

setValue(value) → {this}

Set the input value. To override if needed.

Parameters
Name Type Description
value String

The new value
Returns
Type
this
Inherited From:

getContent() → {HTMLelement}

Returns control content.

Returns

Control container.

Type
HTMLelement
Inherited From:

getInputElement() → {HTMLelement}

Returns the native input element

Returns
Type
HTMLelement
Inherited From:

inject(element, where) → {this}

Inject control in the dom.

Parameters
Name Type Argument Description
element HTMLelement

Dom target
where String <optional>

Where to inject
Returns
Type
this
Inherited From:

remove() → {this}

Remove the control from the dom

Returns
Type
this
Inherited From:

getClassNames(suffixes) → {String}

Generate a CSS class name based on the class name property, its parent classes, and the options "className". It should be used internally (in the control).

Example
var Input = UWA.Controls.Abstract.extend({
   name: 'uwa-input',

   options: {
       className: '',
   },

   buildSkeleton: function () {
       this.elements.container = UWA.createElement('div', { 'class': this.getClassNames() });
       this.elements.content = UWA.createElement('div', { 'class': this.getClassNames('-content') });
   }
});

var Radio = Input.extend({
   name: 'uwa-inputradio'
});

new Radio({
    className: 'toto black'
});
// container will have the class 'toto black uwa-inputradio uwa-input'
// content will have the class 'toto black uwa-inputradio-content uwa-input-content'
Parameters
Name Type Description
suffixes String

All parameters should be strings, used as suffix to append to the UWA.Class names of the inheritance chain.
Returns

The generated CSS class name.

Type
String
Inherited From:

hide()

Hide control content.

Inherited From:

show()

Show control content.

Inherited From:

destroy()

Destroy the control elements and its children. Remove all events and remove the element from the dom. This control and its children should not be used after this.

Inherited From: