Skip to main content

Header How To's

How to's for the Header guide.

How to Use Header?

How to Use Header?

A Header is a component used to display the title of a form. It is used to convey the topic or purpose of the form to the user.

The following steps describe how to add and use the Header component on a form.

1. How to Add a Header Component to a Form?

  1. Open the form design screen.
  2. Go to the Toolbox panel.
  3. Locate the Header component.
  4. Drag and drop it onto the form.
  5. Click the component and configure its settings from the Property Viewer panel.

2. Basic Configurable Properties

PropertyDescription
TextThe title text that will be displayed to the user.
VisibleDetermines whether the Header will be visible on the form.
Width / HeightThe width and height of the header area.
Horizontal AlignSets the alignment of the label text: align left, right, or center.
Heading TypeDetermines the heading type. Possible values are: h1, h2, h3, h4, h5, h6.

3. Usage Examples

Form Title

Used to add titles such as "Employee Information Form", "Sales Proposal", "Customer Registration Form".

Section Header

Can be used as a subheader to separate specific sections within the form.

Informational Text

Can also serve as a static text area for describing the purpose of the form or providing usage instructions.

4. Tips

  • Keep the title as short and clear as possible.
  • If the form is long, add additional headers to sections to improve readability.
  • Use alignment consistent with other components to create a visual hierarchy.

This document explains step-by-step how to use the Header component on a form.


What Is Header?

What Is Header?

A Header is a title component placed at the top of a form to explain the form’s purpose, definition, or content to the user.

This component helps clarify what the form is used for and provides immediate guidance to the user.

Features

  • Displays a fixed and editable title text.
  • Makes the form more understandable and professional.
  • Enhances user experience by providing informative titles.
  • Can be easily added to the form via drag-and-drop.

Usage Areas

  • Form titles
  • Section headers
  • Informative static text areas
  • Labeling different steps of a process

Why Is It Used?

  • To explain the purpose or topic of the form
  • To create a hierarchical visual structure
  • To improve the professional appearance of the form
  • To reduce content complexity and guide the user

This document explains what the Header component is and why it is used in form design.


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.