Component Library - DateTime

About

Date control is used for date, time, date-time values.

Syntax

fr:input-counted
<fr:date-time ref="date-time-value">
    <xforms:label>Date Time : </xforms:label>
    <xforms:alert>Date Time is a required field</xforms:alert>
</fr:date-time>

Variables

label Control label
note Hint text (tool-tip)
info Help contents
alert Invalid state message

Examples

fr:input-counted
<!-- Bindings -->
<xforms:bind nodeset="instance('instance')">
    <xforms:bind nodeset="./date-time-value" type="xs:dateTime" required= "true()" />
    <xforms:bind nodeset="./date-value" type="xs:date" required="true()" />
    <xforms:bind nodeset="./time-value" type="xs:time" required="true()" />
</xforms:bind>

<!-- Date only -->
<fr:date-time ref="date-value">
    <xforms:label>Date : </xforms:label>
    <xforms:alert>Date is a required field</xforms:alert>
</fr:date-time>

<!-- Date & time -->
<fr:date-time ref="date-time-value">
   <xforms:label>Date Time : </xforms:label>
   <xforms:alert>Date Time is a required field</xforms:alert>
</fr:date-time>

<!-- Time only -->
<fr:date-time ref="time-value">
   <xforms:label>Time : </xforms:label>
   <xforms:alert>Time is a required field</xforms:alert>
</fr:date-time>
				
<!-- Date with minimum date sate -->
<fr:date-time ref="date-value">
    <fr:mindate ref="current-date()" />
    <xforms:label>Date with Mindate set : </xforms:label>
    <xforms:alert>Time is a required field</xforms:alert>
</fr:date-time>

Images

Enter labels to add to this page:
Please wait 
Looking for a label? Just start typing.