dateTimeHelper - Date Time Picker

Displays a picker for selection of date and time values in an edit box.

Category

Core Controls

Syntax

<xp:dateTimeHelper attributes>content</xp:dateTimeHelper>
Table 1. Essential properties
Property Description
id Defaults to dateTimeHelper1, dateTimeHelper2, and so on.
Table 2. All properties
Category Properties
basics binding, id, loaded, rendered, rendererType
dojo dojoAttributes, dojoType
format timeClickableIncrement, timeVisibleIncrement, timeVisibleRange
styling disableTheme, themeId

Usage

In Design mode, creation of a Date Time Picker control automatically embeds it in an Edit Box control with a display type of Date/Time. To access the Date Time Picker properties, select Source mode and put focus on the embedded dateTimeHelper element.

At run time, the user can click the picker then select a date and time for insertion into the edit box.

For accessibility compliance, do not specify both for the type property. Consider using two helpers, one type=date and one type=time.

Examples

Two edit boxes contain pickers for selection of date and time values.
<xp:inputText id="inputText1">
	<xp:dateTimeHelper id="dateTimeHelper1"></xp:dateTimeHelper>
	<xp:this.converter>
		<xp:convertDateTime type="date"></xp:convertDateTime>
	</xp:this.converter>
</xp:inputText>
<xp:inputText id="inputText2">
	<xp:dateTimeHelper id="dateTimeHelper2"></xp:dateTimeHelper>
	<xp:this.converter>
		<xp:convertDateTime type="time"></xp:convertDateTime>
	</xp:this.converter>
</xp:inputText>