Versions Compared

Key

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

Table of Contents

Introduction

English
Form Column is the placeholder to hold Form Elements. Each section has one column in it by default. At the section level, you may add more columns to it.

Get Started

The easiest way to see how the Form Column works is to use the existing built-in App Expenses Claims. Here are the steps:

  1. Start the Joget Server and open the App Center.

  2. Log in as admin and click on the pencil icon on the Expenses Claim to open the Design App . Composer (see Figure 1).
    Image Removed
    Image Added
    Figure 1

  3. Click on Expense Claim New and you will be directed to the Form Builder.

  4. Click an on any field then click on the select parent button (see Figure 2). Column will be selected and the Configure Column properties will open (see Figure 3).

    Image Added
    Figure 2

    Image Added

    Figure 3

  5. Hover the mouse over to the top right corner below the section and click Edit Column to open up Edit Column Properties (see Figure 2).
    Image Removed
    Figure 2
    To add new columns, hover over click on the section and for the options to appear then click on the  Add Column button (see Figure 34)
    Image RemovedImage Added

    Figure 34

  6. To edit specific column, hover over to the top right corner within the click anywhere within that specific column (see Figure 45)
    Image Removed
    Image Added
    Figure 45

Column Properties

Image RemovedImage Added

NameDescription
LabelColumn label. Blank by default.
Width

Width of the element.

Code Block
titleExample
30%
120px
Horizontal LayoutHorizontal Layout in the arrangement of elements contained.