DateTimePicker How To's

How to's for the DateTimePicker guide.

How to Use DateTimePicker?

How to Use DateTimePicker?

DateTimePicker is a form component used to collect date or date-time input from the user.
By following the steps below, you can add the control to a form and configure its properties.

1. How to Add the DateTimePicker Control to a Form

1. Open the form in the design interface.
2. Go to the Toolbox panel.
3. Locate the DateTimePicker control.
4. Drag and drop it onto the form.
5. Select the control and configure its properties under the General tab.

2. Configuring Basic Properties

Format

Determines the date or date-time format.
Examples:

• dd.MM.yyyy
• yyyy-MM-dd HH:mm

Set Today As Default

When enabled, the control automatically displays today’s date as the default value.
When the form is first opened, the user will see today’s date, but may change it if needed.

Disable Before

When enabled, this setting restricts the user from selecting dates earlier than a specified point in the past (by defining year, month, or day limits).

• Disable before years → Allows selecting dates only up to X years before today. Selecting earlier dates becomes disabled.
• Disable before months → Allows selecting dates only up to X months before today. Earlier months become disabled.
• Disable before days → Allows selecting dates only up to X days before today. Earlier days become disabled.

Disable After

When enabled, this setting restricts the user from selecting dates later than a specified point in the future (by defining year, month, or day limits).

• Disable after years → Allows selecting dates only up to X years after today. Further dates become disabled.
• Disable after months → Allows selecting dates only up to X months after today. Further months become disabled.
• Disable after days → Allows selecting dates only up to X days after today. Further days become disabled.

Required

Prevents form submission unless a date is selected.

3. Usage Scenarios

Start–End Date Selection

Two DateTimePicker controls can be used to select a time range or duration.

Timestamp in Processes

For example, in a request form:
"Record creation time" can be automatically assigned.

Appointment & Event Scheduling

Users can select both date and time to create an entry.

4. Events

Commonly used events with DateTimePicker:

• On Value Changed → Triggered when the user changes the selected date.

These events can be used to apply validation or business rules.

Notes

• Date format may vary depending on application culture settings.
• If time selection is needed, the datetime mode should be enabled.
• If timezone data is required, additional validations may be necessary.

---

What is DateTimePicker?

What is DateTimePicker?

DateTimePicker is a control component that enables users to easily select a date or a date and time within a form.
It can include a calendar view, a time selector, or a combined date-time picker.

This control is used in all scenarios where date and time input is required, such as birth dates, meeting times, delivery dates, and transaction timestamps.

Features

• Supports selecting a date or date + time
• Provides a calendar popup for easy user selection
• Supports various display formats (dd.MM.yyyy, yyyy-MM-dd, etc.)
• Minimum and maximum date limits can be defined
• Default values can be assigned
• Can work with validation rules

Usage Scenarios

• Transaction, application, or request dates
• Scheduling and meeting times
• Deadline inputs
• Timestamp-required data fields
• Workflow start/end time selections

How to Add It in the Development Interface?

1. With the form open, go to the Toolbox panel
2. Select the DateTimePicker control
3. Drag and drop it onto the form
4. When selected, its properties can be configured under the General and Events tabs

---

How to Use Client Enabled?

What is Client Enabled?

Client Enabled is a property that defines whether a form control is active (enabled) on the client side when the form is first loaded.
If it is set to True, the control is immediately usable by the user.
If it is set to False, the control is disabled and cannot be interacted with until a specific condition or rule activates it.

This property is especially useful for controlling the user’s interaction flow and applying dynamic behaviors using the Rule Manager.

What Does It Do?

The property allows developers to:

• Control when a form control becomes interactive.
• Prevent users from entering or changing data until prerequisites are met.
• Dynamically enable or disable controls based on user input or logic.

Example Scenario — Conditional Activation

Scenario:
A form contains a checkbox called “I Accept Terms” and a text field called “Signature.”
The goal is to make the “Signature” field inactive until the user checks “I Accept Terms.”

Steps to Implement:

1. Select the “Signature” field in the form editor.

2. In the Properties panel, find the Client Enabled field.

3. Set the value to False — the field will now be disabled by default when the form loads.

4. Open the Rule Manager.

5. Add a new rule:

   Condition:

Action:

6. Save and publish the form.

Result:

• When the form loads, the “Signature” field is disabled.
• Once the user checks “I Accept Terms,” the field automatically becomes active and editable.

Behavior Summary

Property State	Description
True	The control is active and ready for user interaction when the form loads.
False	The control is disabled at load time and can be enabled dynamically via rules or code.

Notes & Best Practices

• Use the Client Enabled property to manage client-side interactivity without requiring server actions.
• Combine it with Rule Manager to define when and how controls become active.
• Remember: if server enablement is disabled, the client cannot enable the control even if Client Enabled is set to True.
• By default, this property is set to True (active).

Summary

Client Enabled improves form usability by letting developers control when and how users interact with form controls.
It is essential for creating responsive, condition-based form experiences where user actions dynamically change the form’s state.