Versions Compared

Old Version 1

changes.mady.by.user Hugo

Saved on

compared with

New Version Current

changes.mady.by.user Hugo

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
infoNewly introduced in Joget Workflow v5
Panel
borderColorgreen
borderWidth1
titleBGColor#ddffcc
borderStylesolid
titleNew Feature
Definition

Advanced Grid

...

 is best described as

...

a Grid

...

 with rich inline editing transformation.

Depending on the target field, the Advanced Grid element would mimic the original target type for accurate and richer data entry capability.

...

Panel
borderColorpurple
borderWidth1
titleBGColor#ddccff
borderStylesolid
titleNew Feature

This feature has been enhanced in Joget Workflow v6.

  1. Column format type.
  2. Populating default value from target form.
  3. Default sorting column number.


Image Added

Figure 1: Advanced Grid form element


Image Added

Figure 2

Image Removed

Figure 1: Screenshot highlighting Advanced Grid in Form Builder

Image Removed

Figure 2: Screenshot highlighting Advanced Grid in actual Form

Image Removed

Figure 3: Screenshot highlighting Advanced Grid on Date Picker element in Form Builder

A Date Picker will show up when editing as if the source field itself is a date picker element.


Image RemovedImage Added

Figure 43: Screenshot highlighting Advanced Grid on Select Box element in Form Builder

A Select Box will show up when editing as if the source field itself is a select box element.

 

Image AddedImage Removed

Figure 54: Advanced Grid Properties

NameDescription
IDElement ID. (By declaring as "entries", a corresponding database table column "c_entries" will be created)
LabelElement Label to be displayed to end user.
FormTarget form for record editing.
Columns

The columns defined here must be correspondent to the Form chosen above.

NameDescription
Value

Field ID of the target form.

Example:

In "HR Expense Claim Entry" form, there are Form Elements with the ID "date", "category", "purpose", and "formattedAmount"

LabelColumn Label.
Format Type

If you would like to format the returned value, you may make use of the format type.

Available Format Types

  • Date - formats the field as date.
  • Decimal - formats the field as decimal.
Width

Column width in characters.

Code Block
titleSample
200px
Readonly

Determines if the column is editable.

 

Image AddedImage Removed

Figure 65: Advanced Grid Properties - UI

NameDescription
SearchEnable search capability within the grid data itself.
Readonly

Determines if the element is editable.

Disable Add FeatureDetermines if a new row can be added.
Disable Delete Feature

Determines if a row can be removed.

Default Sorting Column Number

Defines the column index to sort by default. This field accepts integers starting from 1 onwards only.

Example: If the grid has 5 columns, inputting a "4" will sort the 4th column from the left in ascending order.

Sort in descending order?This option is only available once there is input in "Default Sorting Column Number". Check to sort in descending order instead.
Delete confirmation messageConfirmation message when deleting a row.
Show Row Numbering?Shows numbering on the grid.
Key to save cellKeyboard key to use to determine when to save and move on to the next cell.
Edit hintEdit hint message.
Record Per PagePaging Parameter - Record to show per Page
Paging OptionsPaging Parameter - Paging Options

 

Figure 76: Advanced Grid Properties - Validation & Data Binder

NameDescription
Validator

Attach a Validator plugin to validate the input value. Please see Form Validator.

Info
titleWhen will validation takes place?

Validation will takes place whenever form is submitted except when it is submitted as "Save as Draft".

Unique ColumnColumn/Field ID to identify record ID.
Min Number of Row Validation (Integer)
Min Number of Row Validation (Integer)
Max Number of Row Validation (Integer)
Max Number of Row Validation (Integer)
Error Message
Error message to be shown when row requirements set above is not met.
Load Binder

Option by default. Grid data will be saved/loaded in JSON format in its defined database cell.

In this example, Multirow Form Binder is used to load data from other form. See list of available Form Binder .

Store Binder

Option by default. Grid data will be saved/loaded in JSON format in its defined database cell.

In this example, Multirow Form Binder is used to load data from other form.See list of available Form Binder .