| Panel |
|---|
| borderColor | green |
|---|
| borderWidth | 1 |
|---|
| titleBGColor | #ddffcc |
|---|
| borderStyle | solid |
|---|
| title | Definition |
|---|
|
List Grid is best described as similar to a Form Grid, but with the capability to add new records from a Datalist instead. |
| Panel |
|---|
| borderColor | purple |
|---|
| borderWidth | 1 |
|---|
| titleBGColor | #ddccff |
|---|
| borderStyle | solid |
|---|
| title | New Feature |
|---|
|
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
Image Modified
Figure 2: Screenshot highlighting adding new records using List Grid in Form
Image Modified
Figure 3: Screenshot highlighting new records added in List Grid in Form
Image Modified
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. | Name | Description |
|---|
| Value | Field ID of the target form. Example: In "Account" form sourced in the Datalist "Account Listing", there are Form Elements with the ID "id", and "accountName". | | Label | Column Label. | | Editable | Yes/No | | Format Type | If you would like to format the returned value, you may make use of the format type. Default choice: Text Available Format Types - Text - formats the value as text
- HTML - outputs data as HTML
- Multiple lines text - maintains the spacing formatting for multiple lines text, such as TextArea.
- Decimal - formats as decimal. Number of decimals is expected in the "Format" field.
Date - formats as date. Original Date and New Date formats are expected in the "Format" field. | Panel |
|---|
| borderColor | blue |
|---|
| borderWidth | 1 |
|---|
| titleBGColor | #ddffcc |
|---|
| borderStyle | solid |
|---|
| Format: (original format)|(new format) Example of usage:
Original value: 5/23/2012
Expected value: 2012/5/23
Format : M/d/y|y/M/d Note: Please refer to Java SimpleDateFormat for date format. |
File - Show the value as a link to the attachment. Form Def ID is expected in the "Format" field. | Info |
|---|
| title | Expected Form Def ID |
|---|
| Specify the Form Def ID that contains the actual File Upload form element. |
Image - Show the value as a thumbnail of the attachment. Form Def ID is expected in the "Format" field. | Info |
|---|
| title | Expected Form Def ID |
|---|
| Specify the Form Def ID that contains the actual Image Upload / File Upload form element. |
Options - Show the label of multiple choice element given the value given. Form Def ID is expected in the "Format" field. | Info |
|---|
| title | Expected Form Def ID |
|---|
| Specify the Form Def ID that contains the actual Select Box / Radio / Check Box form element. |
| | Format | Depending on your chosen Format Type, additional argument may be entered here. | | Width | Column width in characters. |
|
Image Removed
Image Added
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 |
Popup Dialog Width | Width in character |
Image Added
Image Removed
Figure 6: List Grid Properties - Validation & Data Binder
| Name | Description |
|---|
| Validator | Attach a Validator plugin to validate the input value. | Info |
|---|
| title | 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. | Panel |
|---|
| borderColor | #ffa700 |
|---|
| borderWidth | 1 |
|---|
| titleBGColor | #ffdb99 |
|---|
| borderStyle | solid |
|---|
| title | 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. | Panel |
|---|
| borderColor | #ffa700 |
|---|
| borderWidth | 1 |
|---|
| titleBGColor | #ffdb99 |
|---|
| borderStyle | solid |
|---|
| title | 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). | Panel |
|---|
| borderColor | #ffa700 |
|---|
| borderWidth | 1 |
|---|
| titleBGColor | #ffdb99 |
|---|
| borderStyle | solid |
|---|
| title | 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. |
Image Modified
Figure 7: List Grid Properties - Advanced
...