Columns

Introduction

The Columns Report Element allows you to create a structured layout by adding columns to the body of your report. This element is part of Joget's extensible Report Element architecture, enabling users to organize content effectively within their custom reports.

Get started

How to use it

To use the Columns Report Element:

  1. In your report designer, find the Columns element in the palette.
  2. Drag and drop it onto the report canvas.

Configure columns properties

Once the Columns element is added, you can configure its properties to customize the layout.

Edit columns

Fields to configure:

  • Type: Choose the column layout that best suits your report:
    • 1 column
    • 2 columns
    • 2 columns with a smaller left column
    • 2 columns with a smaller right column
    • 3 columns
    • 4 columns
  • Gap Width: Define the gap width between the columns in percentages.
    Example:
    50%
  • Margin Bottom: Set the bottom margin of the column.
    Example:
    50px or 50%
  • Display Border?: Check this option if you want the border of the columns to be displayed.

Border style

This section is only available when the Display Border is checked.

Fields to configure:

  • Size: Specify the border size.
    Example:
    2px
  • Color: Enter the hex color code for the border. You can also use the color picker tool.
  • Style: Choose the border style:
    • Solid
    • Dashed
    • Dotted
    • Double
  • Padding Top: Define the top padding of the column.
  • Padding Bottom: Define the bottom padding of the column.
  • Padding Left: Define the left padding of the column.
  • Padding Right: Define the right padding of the column.

Advanced options

Field to configure:

  • Permission: Set permission controls to manage who can view this column. See Permission Control.
Created by Julieth Last modified by Aadrian on Nov 26, 2024