Flowable Forms

Flowable Forms

  • Release Notes
  • Guides
  • Components
  • Storybook

›Components

Components

  • Introduction
  • Accordion
  • Button Group
  • Checkbox
  • Columns
  • Data Table
  • Date
  • Doc Gallery
  • Flex Layout
  • HR
  • HTML
  • iFrame
  • Image
  • Link
  • Link Button
  • List
  • Modal
  • Number
  • Outcome Button Group
  • Panel
  • Password
  • PDF Viewer
  • Radio button
  • REST Button
  • RichText editor
  • Assign Button
  • Select
  • Text List
  • Sub-Form
  • Tabs
  • Text
  • Textarea
  • Upload
  • Wizard

Date

Date and time picker

Demo

Basic example

Format and time example

Attributes

AttributeTypeDescription
typestringType expected is date.
defaultValuestringSee Formats. Section below.

See section Common attributes.

Extra attributes

AttributeTypeDescription
enableTimebooleanAllow selection of hour and minutes
timeIntervalbooleanSelectable time list divided by timeInterval. Default is 15
timeFormatstringFormat of the time which will be used for rendering in the time selection.
formatstringDate will be rendered using this format. See the Formats section below
maxDatestringMaximum selectable date. See the Formats section below
minDatestringMinimum selectable date. See the Formats section below
minDateErrorMessagestringCustom error message for minDate validation
maxDateErrorMessagestringCustom error message for maxDate validation

Formats

This component uses date values in different formats:

  • today current date
  • PNumPeriod relative date, where P is fixed, Num is any number and Period is a letter correspondig to Day, Month or Year. For example:
    • P-12D means subtract 12 days from the current date
    • P2M means add 2 month to the current date
    • P15Y means add 15 years to the current date
  • 2018-03-21 exact date

In order to format values this component uses Moment.js string format.
For example: YYYY-MM-DD, D/M/YY or dddd at HH:mm

For using date formatting inside expressions, see section Expressions.

When to use it

Use it to select oredit dates, with or without times. Allows dates and times to be added or edited in a human readable way with configurable formats, including picking dates and times from a calendar.

← Data TableDoc Gallery →
Docs
GuidesComponents
Private
SourceStorybook
Flowable Forms
Copyright © 2020 Flowable