Date & Time

amx:inputDate

The Date & Time component is used to select date and/or time. This includes month, day and year for date and hour, minute and AM/PM for time. The component has these elements.

Label: An optional label for the component.
Container: A long container with a border.
Text: This is the text of the selected item.
Arrow: This is the downward pointing arrow at the end of the container.
Picker: The picker is where the user selects the date and/or time. When the picker closes the saved date and/or time is displayed on the trigger.

Appearance

Appearance characteristics for this component.

TRIGGER

Component: A Choice is used as a trigger for select date and/or time.
Order: The date appears first and the time appears next.
Label: An optional label may be displayed.
State: Supports enabled, pressed, disabled and read-only.
Selection: Supports selected and unselected.
Read-Only: The selected item is bold text.
Rendered: This component can be shown or hidden.

PICKER

Popup: Pickers are displayed in a Popup component.
iOS Picker: The native iOS component is used
Android Picker: A custom Android component is used

Title: Select a date and time is the title for this popup.
Mode: A segmented button toggles the user between date and time.
Arrows: Up and down arrows are use to increment date or time.
Values: Month (3 character abbreviation), day and year are displayed for date, while Hour, Minute and AM/PM are displayed for time
Clear: An X icon is used to Clear the values.
Buttons: Cancel and OK buttons are displayed.

Behavior

Common behaviors for this component.

TRIGGER

Selected: If a date and/or time has been selected already, the date and/or time should display in the trigger.
Empty: If a date and/or time it has not been selected the trigger will be empty.
Saved: If selections on the picker have been saved, when the picker closes the new date and/or time should be displayed in the trigger..

PICKER

Open: The picker is a popup that displays when the user taps the trigger.
Close: When the picker closes and if the date and/or time change is saved the trigger will be updated..
Error: If the date/time is a required field and the user leaves it blank, then an error message should display.

Usage

Usage guidelines for this component.

Recommended to use whenever users need to enter dates and/or times, because it helps users enter dates and times in the proper format.
This trigger component occupies a small amount of space on a page or form.
It supports relatively simple date and/or time selection, but consider Calendars when date/time selection needs to be done over days, weeks, months, etc...
On Android the date picker is best used for dates that within a few months of the current date, due to the tapping needed to make large scale changes.

Sample

AMX sample code for this component.


    
    <amx:inputDate label="Enabled" id="id1"/>

    <amx:inputDate label="Disabled" id="id2" disabled="true"/>

    <amx:inputDate label="Read-Only" id="id3" readOnly="true"/>