List Grid is best described similar to a Form Grid, but with the capability to add new records from a Datalist instead.
New feature added in Joget Workflow v6.
- Paging
- Delete Options
- Multiple Lines Format Type
Figure 1: Screenshot highlighting List Grid in Form Builder
Modified the form in http://localhost:8080/jw/web/console/app/crm/1/form/builder/crm_contact
Figure 2: Screenshot highlighting adding new records using List Grid in Form
Figure 3: Screenshot highlighting new records added in List Grid in Form
Figure 4: List Grid Properties
| Name | Description | ||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| ID | Element ID (By declaring as "account", a corresponding database table column "c_account" will be created) | ||||||||||||||
| Label | Element Label to be displayed to end user. | ||||||||||||||
| Datalist | Datalist to display for selection. | ||||||||||||||
| Columns | The columns defined here must be correspondent to the Data List chosen above.
|
Figure 5: List Grid Properties - UI
| Name | Description |
|---|---|
| Enable Sorting Feature | Determines if ordering of rows is to be enforced. |
Field ID for Sorting | Field to keep the ordering sequence; must correspond with a field id in the target form. |
Insert Button Label | Insert Button Label |
Form to Edit Row | After addition of row, user may edit the record row by opening it in the Form defined here. |
Form Submit Button Label (Normal Mode) | Label of the Submit button in normal mode. |
Form Submit Button Label (Readonly Mode) | Label of the Submit button in read-only mode. |
Display field as Label when readonly? | Displays the value of the element as plain text when element is set to "Readonly". |
| Readonly | Determines if the element is editable. |
Disable Add Feature | Determines if a new row can be added. |
Disable Delete Feature | Determines if a row can be removed. |
Delete confirmation message | Confirmation message when deleting a row. |
Show Row Numbering? | Show additional column on the leftmost to denote numbering. |
| Paging Size | Items to be displayed per page. |
Popup Dialog Height | Height in character Sample 500px |
Popup Dialog Width | Width in character Sample 90% |
Figure 6: List Grid Properties - Validation & Data Binder
| Name | Description |
|---|---|
| Validator | Attach a Validator plugin to validate the input value. When will validation takes place? Validation will takes place whenever form is submitted except when it is submitted as "Save as Draft". |
| Unique Column | Column/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. |
Store Binder | Option by default. Grid data will be saved/loaded in JSON format in its defined database cell. |
| Delete Associated Grid Data? | If the popup form have grid element(s), this option will delete the inner grid data. Caution These 3 options: (Delete Associated Grid Data, Delete Associated Child Form Data, Delete Files), in combination, does apply to nested grid/child elements. These options traverses the entire form tree. Upon encountering a 'false' condition, it will move on to the next grid/child element. Example: Consider that the popup form has a form grid, form grid has a subform, subform has a file upload element with abc.pdf. If all options are checked, abc.pdf will be deleted. If all except ONE of the option is checked, abc.pdf will NOT be deleted. |
| Delete Associated Child Form Data? | If the popup form have child element(s), this option will delete the child data. Caution These 3 options: (Delete Associated Grid Data, Delete Associated Child Form Data, Delete Files), in combination, does apply to nested grid/child elements. |
| Delete Files? | If the popup form contains file upload element, this option will delete the actual uploaded file(s). Caution These 3 options: (Delete Associated Grid Data, Delete Associated Child Form Data, Delete Files), in combination, does apply to nested grid/child elements. |
| Abort Related Running Processes? | If there are process instances related to the deleted row, this options will abort those process instances. |
Figure 7: List Grid Properties - Advanced
| Name | Description | ||||||||
|---|---|---|---|---|---|---|---|---|---|
URL Request Parameters for Datalist | Refine the target Data List selections by defining the filter criteria here.
|