Alloy UI

aui-calendar  1.0.1

 
Filters

Class DatePickerSelect - extends Calendar

A base class for DatePickerSelect, providing:
  • Widget Lifecycle (initializer, renderUI, bindUI, syncUI, destructor)
  • Select a date from Calendar to select elements
Quick Example:
var instance = new A.DatePickerSelect({
srcNode: '#srcNodeId',
// locale: 'pt-br',
dateFormat: '%m/%d/%y',
yearRange: [ 1970, 2009 ]
}).render();
Check the list of Configuration Attributes available for DatePickerSelect.

Constructor

DatePickerSelect ( config )
Parameters:
config <Object> Object literal specifying widget configuration properties.

Properties

DatePickerSelect.ATTRS - static Object

Static property used to define the default attribute configuration for the DatePickerSelect.

DatePickerSelect.HTML_PARSER - static Object

Object hash, defining how attribute values are to be parsed from markup contained in the widget's content box.

DatePickerSelect.NAME - static String

Static property provides a string to identify the class.

Properties inherited from WidgetPositionConstrain:

Properties inherited from WidgetStack:

Properties inherited from Attribute:

Properties inherited from Component:

Properties inherited from WidgetPositionAlign:

Properties inherited from Base:

Properties inherited from WidgetStdMod:

Properties inherited from WidgetPosition:

Properties inherited from OverlayContext:

Configuration Attributes

appendOrder - Array

The order the selects elements are appended to the srcNode.
Default Value: [ 'm', 'd', 'y' ]

baseName - String

A basename to identify the select elements from this DatePickerSelect.
Default Value: datepicker

buttonNode - String

DOM Node to display the button of the DatePickerSelect. If not specified try to query using HTML_PARSER an element inside contentBox which matches aui-buttonitem.
Default Value: Generated div element.

dayNode - String | Node

DOM Node to display the day of the DatePickerSelect. If not specified try to query using HTML_PARSER an element inside contentBox which matches aui-datepicker-year.
Default Value: Generated div element.

dayNodeName - String

Name attribute used on the dayNode.
Default Value: day

monthNode - String | Node

DOM Node to display the month of the DatePickerSelect. If not specified try to query using HTML_PARSER an element inside contentBox which matches aui-datepicker-year.
Default Value: Generated div element.

monthNodeName - String

Name attribute used on the monthNode.
Default Value: month

populateDay - boolean

If true the select element for the days will be automatic populated.
Default Value: true

populateMonth - boolean

If true the select element for the month will be automatic populated.
Default Value: true

populateYear - boolean

If true the select element for the year will be automatic populated.
Default Value: true

selectWrapperNode - String

DOM Node to display the selects of the DatePickerSelect. If not specified try to query using HTML_PARSER an element inside contentBox which matches aui-datepicker-select-wrapper.
Default Value: Generated div element.

setValue - boolean

Inherited from Calendar.
Default Value: false

trigger - {Node | String}

Trigger element to open the calendar. Inherited from OverlayContext.
Default Value: Generated HTLM div element

visible - boolean

If true the Calendar is visible by default after the render phase. Inherited from OverlayContext.
Default Value: false

yearNode - String | Node

DOM Node to display the year of the DatePickerSelect. If not specified try to query using HTML_PARSER an element inside contentBox which matches aui-datepicker-year.
Default Value: Generated div element.

yearNodeName - String

Name attribute used on the yearNode.
Default Value: year

yearRange - Array

Year range to be displayed on the year select element. By default it displays from -10 to +10 years from the current year.
Default Value: [ year - 10, year + 10 ]

Configuration attributes inherited from WidgetPositionConstrain:

Configuration attributes inherited from Widget:

Configuration attributes inherited from WidgetStack:

Configuration attributes inherited from Component:

Configuration attributes inherited from WidgetPositionAlign:

Configuration attributes inherited from Base:

Configuration attributes inherited from WidgetStdMod:

Configuration attributes inherited from WidgetPosition:

x,
xy,
y

Methods

_afterDisabledChangeDatePicker

protected void _afterDisabledChangeDatePicker ( event )
Fired after disabled is set.
Parameters:
event <EventFacade>

_afterSetCurrentMonth

protected void _afterSetCurrentMonth ( event )
Fired after currentMonth is set.
Parameters:
event <EventFacade>

_bindSelectEvents

protected void _bindSelectEvents ( )
Bind events on each select element (change, keypress, etc).

_getAppendOrder

protected Array _getAppendOrder ( )
Gets an Array with the field elements in the correct order defined on appendOrder.

_onSelectChange

protected void _onSelectChange ( event )
Fired on any select change.
Parameters:
event <EventFacade>

_populateDays

protected void _populateDays ( )
Populate the day select element with the correct data.

_populateMonths

protected void _populateMonths ( )
Populate the month select element with the correct data.

_populateSelect

protected String _populateSelect ( select , fromIndex , toIndex , values )
Populate a select element with the data passed on the params.
Parameters:
select <HTMLSelectElement> Select to be populated
fromIndex <Number> Index to start
toIndex <Number> Index to end
values <Object> Object with labels to be used as content of each option. Optional.

_populateYears

protected void _populateYears ( )
Populate the year select element with the correct data.

_pupulateSelects

protected void _pupulateSelects ( )
Populate each select element with the correct data for the day, month and year.

_renderElements

protected void _renderElements ( )
Render DOM elements for the DatePickerSelect.

_renderTriggerButton

protected void _renderTriggerButton ( )
Render DOM element for the trigger button of the DatePickerSelect.

_selectCurrentDay

protected void _selectCurrentDay ( )
Select the current day on the respective input field.

_selectCurrentMonth

protected void _selectCurrentMonth ( )
Select the current month on the respective input field.

_selectCurrentValues

protected void _selectCurrentValues ( )
Select the current values for the day, month and year to the respective input field.

_selectCurrentYear

protected void _selectCurrentYear ( )
Select the current year on the respective input field.

bindUI

protected void bindUI ( )
Bind the events on the DatePickerSelect UI. Lifecycle.

renderUI

protected void renderUI ( )
Create the DOM structure for the DatePickerSelect. Lifecycle.

syncUI

protected void syncUI ( )
Sync the DatePickerSelect UI. Lifecycle.

Methods inherited from Plugin.Host:

Events

appendOrderChange

appendOrderChange ( event )
Fires when the value for the configuration attribute 'appendOrder' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

baseNameChange

baseNameChange ( event )
Fires when the value for the configuration attribute 'baseName' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

buttonNodeChange

buttonNodeChange ( event )
Fires when the value for the configuration attribute 'buttonNode' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

dayNodeChange

dayNodeChange ( event )
Fires when the value for the configuration attribute 'dayNode' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

dayNodeNameChange

dayNodeNameChange ( event )
Fires when the value for the configuration attribute 'dayNodeName' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

monthNodeChange

monthNodeChange ( event )
Fires when the value for the configuration attribute 'monthNode' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

monthNodeNameChange

monthNodeNameChange ( event )
Fires when the value for the configuration attribute 'monthNodeName' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

populateDayChange

populateDayChange ( event )
Fires when the value for the configuration attribute 'populateDay' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

populateMonthChange

populateMonthChange ( event )
Fires when the value for the configuration attribute 'populateMonth' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

populateYearChange

populateYearChange ( event )
Fires when the value for the configuration attribute 'populateYear' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

selectWrapperNodeChange

selectWrapperNodeChange ( event )
Fires when the value for the configuration attribute 'selectWrapperNode' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

setValueChange

setValueChange ( event )
Fires when the value for the configuration attribute 'setValue' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

triggerChange

triggerChange ( event )
Fires when the value for the configuration attribute 'trigger' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

visibleChange

visibleChange ( event )
Fires when the value for the configuration attribute 'visible' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

yearNodeChange

yearNodeChange ( event )
Fires when the value for the configuration attribute 'yearNode' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

yearNodeNameChange

yearNodeNameChange ( event )
Fires when the value for the configuration attribute 'yearNodeName' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

yearRangeChange

yearRangeChange ( event )
Fires when the value for the configuration attribute 'yearRange' is changed. You can listen for the event using the on method if you wish to be notified before the attribute's value has changed, or using the after method if you wish to be notified after the attribute's value has changed.
Parameters:
event<Event.Facade> An Event Facade object with the following attribute specific properties added:
prevVal
The value of the attribute, prior to it being set
newVal
The value the attribute is to be set to
attrName
The name of the attribute being set
subAttrName
If setting a property within the attribute's value, the name of the sub-attribute property being set

Events inherited from WidgetStack:

Events inherited from Base:

Events inherited from WidgetPosition: