TEXT FIELD WITH FORMAT

Use the format property to split a Text Field into two or more parts. This works great for adding the year, month and day (YYYY/MM/DD) to a date field.

The format property allows you to split the text field into multiple parts. This is helpful when formatting for numerical calendar dates; for example, if you entered YYYY/MM/DD, the field would divide into three sections to allow for the year, month, and day.

The format rule is available for Single Line Text, Date, Time, and Date and Time.

In the below example, you can see the text type is Date, and it has the format rule applied; YYYY-MM-DD. In the form preview, you can see that three small input boxes are available for each division of the format rule.

format-rule

Formatting a Text Field

Compatible placeholder characters for the format field are:

# : For characters

d : For digits

You can signal a divide in the field using a separator. Some examples of these are:

##:##:##

Suggested use: time. * Slash

##/##/##

Suggested use: date. * Parenthesis

(dd) (ddd) (ddddddddd)

Suggested use: telephone number.

Hint: You can mix # (characters) and d (digits) if your field needs it; for example, ##/dd/##.

Customising the Length of the Field

##/### = Part 1: three characters | Part 2: two characters

#[0-3]:##:#* = Part 1: three characters | Part 2: zero to three characters | Part 3: any number of characters.

Reserved Characters and Escape

If the separator you want to use is a reserved character, you can escape (force it) it by using \ one place before the divide.

Here are some examples of using \ to separate fields:

The separator is [, ], and *. The render looks like xx[yy]cc*dd.

The separator is \. The render looks like ##\##\##.

Formatting the Date and Time Field

YYYY/MM/DD - Time

hh:mm:ss

Please Note: The letters are case-sensitive, therefore, yyyy/mm/dd (lowercase) won’t render correctly.

We use moment.js to convert date and time format rule. Learn more about formatting date and time with moment.js.