Skip to main content

Panel How To's

How to's for the Panel guide.

How to Use Panel?​

How to Use Panel?​

The following steps should be followed to add and configure the Panel object on a form.

Add the Panel Object to the Form​

  1. Open the form design screen
  2. Go to the Toolbox panel
  3. Locate the Panel object
  4. Drag and drop the object onto the form

Move Objects into the Panel​

  • To place form objects inside the panel:
    • Drag and drop them into the panel
    • Or move them under the panel from the hierarchy panel

The panel contains all objects placed inside it.

Configure Panel Properties​

When the panel is selected, the following tabs are displayed in the Property Viewer panel:

General Tab​

  • Caption / Title → Panel title
  • Header Mode → Setting the Object Header Structure
  • Visible → Visibility control

Use the Expand / Collapse Feature​

  • When Collapsible is enabled:
    • The user can expand or collapse the panel
  • If Collapsed = True:
    • The panel is collapsed by default

This feature is especially recommended for:

  • Advanced settings
  • Optional fields
  • Long forms

Example Scenario​

User Information Form

  • Panel 1: General Information
  • Panel 2: Contact Information
  • Panel 3: Additional Information (collapsed by default)

With this structure, the form becomes:

  • More readable
  • More user-friendly
  • More manageable

Notes​

  • A Panel can contain another Panel (nested panel)
  • Validation rules apply to the objects inside the panel
  • Panel is only a visual and structural object; it does not store data

What Is Panel?​

What Is Panel?​

Panel is a container object used to bring together objects on a form into logical or functional groups.

With a Panel:

  • Related fields can be collected under a single structure
  • The form becomes cleaner and more readable
  • Complexity is reduced for the end user
  • Sections can be shown or hidden based on need

Panel is especially preferred to improve user experience in long and complex forms.

Advantages Provided by Panel​

  • Grouping objects
  • Expand / Collapse (collapse) support
  • Simplifying form layout
  • Logical segmentation (General Information, Details, Additional Information, etc.)

Usage Scenarios​

  • Sections such as user information / address information
  • Hiding optional fields
  • Keeping advanced settings collapsed by default
  • Improving readability by dividing the form into sections

Notes​

  • Panel does not hold data by itself
  • It visually and functionally manages the objects placed inside it
  • User interaction can be enhanced by enabling the collapse feature

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:

  1. 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 StateDescription
TrueThe control is active and ready for user interaction when the form loads.
FalseThe 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.