Home > Date

Date

Date is a Data Type that allows for the entry or selection of a date.  In addition to being added as an extrinsic field, there are a number of intrinsic date fields.

Creating a Date data type:
To create a Date data type:

  1. Add a New Extrinsic Field
  2. Select "Date" as the Data Type.
  3. Click Add.
  4. Edit the Field Properties to control how the user can input the date by updating the Configuration field.
    • Notes: 
      • On a mobile device that supports HTML5 date entry, the native date picker is used in lieu of date picker picker shown here.  Since the native picker is being used, the configuration settings below do NOT apply.  As such you cannot rely on those setting to validation the date.  They are only to help with data entry.
      • Supported devices are controlled through DatePickerUserAgentRegex App Config setting.  It is possible to disable the HTML5 picker by setting this value to an empty string.
      • The Configuration field requires a special format shown in the example below.
      • The Configuration field is not available for intrinsic date fields; only for extrinsic date fields and does NOT apply to the HTML5 date picker, when enabled.
    • Configuration field options:
      • UsePicker - Defaults to true. If false, date picker is disabled and user can only type in dates with the keyboard.
      • MinDate - The minimum selectable date, or NULL if no minimum.  
        • Can be a DATE
        • Can be a NUMBER of days from today [+/-]
        • Note: This ONLY LIMITS WHAT CAN BE SELECTED IN THE DATE PICKER.  Users can manually enter dates outside of this value if AllowTextEntry is true. 
      • MaxDate - The maximum selectable date, or NULL if no maximum.
        • Can be a DATE
        • Can be a NUMBER of days from today [+/-]
        • Note: This ONLY LIMITS WHAT CAN BE SELECTED IN THE DATE PICKER. Users can manually enter dates outside of this value if AllowTextEntry is true. 
      • Tooltip - Defaults to "Format mm/dd/yyyy"; Displayed as tooltip and status bar text 
      • AllowTextEntry - Defaults to true. If false, the user cannot type in a date and must use the date picker.
      • ShowIcon - Defaults to false. If true, shows an icon next to the textbox that opens the picker.
      • OpenOnFocus - Defaults to true. When the user tabs or clicks into the date field, the date picker is opened automatically. 
      • CanSelectMonth - Defaults to true. User sees a dropdown of month names in the date picker; months are abbreviated to three characters.
      • CanSelectYear - Defaults to true. User sees a dropdown of year values in the date picker.
      • YearRange - Default to "c-10:c+10" which defines the range of years displayed in the year drop-down.
        • Can be relative to today's year: "-nn:+nn"
        • Can be relative to selected year: "c-nn:c+nn"
        • Can be an absolute range: "nnnn:nnnn"

Example Configuration String:

{

DateAttributeStepConfig: { 
UsePicker: true, 
MinDate: null, 
MaxDate: null,
Tooltip: "Format mm/dd/yyyy",
AllowTextEntry: true, 
ShowIcon: true, 
OpenOnFocus: true, 
ChangeMonth: true, 
ChangeYear: true, 
YearRange: "c-10:c+10" 
}
}
Note: Only those settings where something other than the default behavior is desired are required.

Date 
Input Field

The following is an example of a Date Input Field with the configuration options in the example configuration string above:

Date Entry Formatting

See also

Home