Versions Compared

Old Version 14

changes.mady.by.user Inese Auzina

Saved on

compared with

New Version 15

changes.mady.by.user Mercedes Rothwell

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

The date field is used to select the date and time.

Related Topics

Functionality

Appearance

During run-time the field shows a pop-up calendar, where the user selects the date.

Date field with the pop-up calendar

By clicking in the month in the calendar pop-up, a month and year pop-up appears and the user can scroll for the necessary year and select the month.

Image RemovedImage Added

Date field with the month and year pop-up

After selecting the date, if the field is configured that way, the time pop-up appears and the user can scroll for the necessary hour and minutes, and change AM to PM.

Image RemovedImage Added

Date field with the time pop-up


The example below shows how to create a field for selecting a Driver’s license issue date. It will be a Date field, with only date values (as time is not needed here), that will synchronize to a PDF form.

Step 1: Add a Date Field.

Open Add Field panel. Add a Date field to the page. Enter the following values for the field settings:

Field

Value

Field Label

<b>Driver License (or ID) Issue Date</b>

Info

You can use HTML tags to format the label.

Meta Field Name

Owner1.DriverLicenseIDIssueDate

Display Type

Custom

A custom format with only the date picker will be shown to the user.

Custom Format

EEEE, MMMM d, y

The result will show the weekday and the full date, like this "Tuesday, January 5, 2016".

Enable Date

Selected

This will show date selection pop-up to the user.

Enable Time

Deselected

This will hide the time selection pop-up from the user.

Size by content

Selected

The field size will be reduced to the size of the date entered.

Adding a Date field

Step 2: Apply the Changes.

1
Rw ui steps macro
Rw step

Click Apply button at the bottom of the screen to close the Widget Design Screen and apply changes.

2
Rw step

Then click Save button at the top of the Widget Details Screen to save these changes.

Step 3: Test the Widget.

Step

Result

1
Rw ui steps macro
Rw step

Test the widget by opening it.

Image Removed

Date field in the wizard

2
Rw step

Click on the Calendar icon to open the date picker.

3
Rw step

Select a date. It should appear in the date field.

Image Added

Date field in the wizard