The Advanced Datagrid component provides a fully featured data management grid with add, edit, delete, and view operations. It supports modal and inline row editing modes, custom button labels, delete confirmation dialogs, accordion display, and extensive formatting options.
How to read settings tables
The tables below describe each configurable option as it displays in the Unqork IDE. Values are formatted as follows: inline code — a value to type exactly as shown | Bold — a value selected from a drop-down, radio button, tab, or choice chip | ON/OFF — toggle state | ✓ — checkbox checked | ☐ — checkbox unchecked
General Settings
Setting
Field
Type
Default
Description
Property ID
key
Text input
adg
The unique identifier for this component instance.
Display Settings
Field Text
Setting
Field
Type
Default
Description
Label Text
label
Text input
Advanced Datagrid
Identifies the component on the canvas and informs end-users what information is requested.
Default State Options
Setting
Field
Type
Default
Description
Disable User Input
disabled
Toggle
OFF
Disables all grid interactions for end-users.
Draft Save
allowDraftSave
Toggle
OFF
Lets end-users save a draft of grid data without submitting.
Hide Label
hideLabel
Toggle
ON
Hides the label. The label remains visible in the Module Builder.
Hide Component
hidden
Toggle
OFF
Hides the component from end-users but always displays in the Module Builder.
Modal Formatting
Setting
Field
Type
Default
Description
Modal Title
modalTitle
Text input
—
The heading of the modal that displays when adding or editing a row.
Modal Message
modalMessage
Text input
Loading please wait...
Text displayed while the modal is loading.
When to Reset the Form
resetAction
Drop-down
On Add
Drop-down that sets when the form inside the modal resets. Options: On Add, On Save.
Fullscreen
fullscreen
Toggle
OFF
Displays the modal in fullscreen mode.
OK Button Label
confirmationButton
Text input
OK
The label on the modal's confirm/close button.
Save Button Label
saveButton
Text input
Save
The label on the modal's save button.
Grid Formatting
Setting
Field
Type
Default
Description
Delete Title
deleteTitle
Text input
Confirm Deletion
The heading of the delete confirmation dialog.
Delete Text
deleteMessage
Text input
Are you sure you want to delete this item?
The body text of the delete confirmation dialog.
Title for Save Confirmation Alert
saveTitle
Text input
—
The title of the save confirmation alert in inline display mode.
Message for Save Confirmation Alert
saveMessage
Text input
—
The message of the save confirmation alert in inline display mode.
Save Event
saveEvent
Text input
—
An event fired when a row is saved in inline mode.
Message While Saving
savingMessage
Text input
Saving...
Text displayed while a row is being saved.
Cancel Button
cancelButton
Text input
Cancel
The label on the cancel button.
Action Label
actionLabel
Text input
Actions
The label for the actions column or menu.
Add Button Label
addButton
Text input
Add
The label on the add row button.
Edit Button Label
editButton
Text input
Edit
The label on the edit row button.
Delete Button Label
deleteButton
Text input
Delete
The label on the delete row button.
View Label
viewButton
Text input
View
The label on the view button, shown when the component is disabled.
Confirm Deletion
showDeleteConfirmation
Toggle
OFF
Displays a confirmation dialog before deleting a row.
Show Yes/No Instead of Delete/Edit
displayYesNo
Toggle
OFF
Replaces Delete/Edit buttons with Yes/No questions in the table.
Show Select Option Instead of Add/Edit
displaySelectOption
Toggle
OFF
Replaces Add/Edit buttons with a Select option using Yes/No questions.
Remember Scroll Position
rememberScrollPosition
Toggle
OFF
Restores the end-user's scroll position after editing.
Display Inline Rows
displayInlineRows
Toggle
OFF
Displays rows as an accordion panel instead of opening a modal for editing.
↳ Default First Row to Open
openFirstRow
Toggle
OFF
Automatically opens the first accordion row on load. Visible when Display Inline Rows is ON.
↳ Show the Save Button in the Accordions
showSave
Toggle
OFF
Adds a save button inside each accordion panel. Visible when Display Inline Rows is ON.
↳ Show a Modal for Confirmation of Save
saveConfirmation
Toggle
OFF
Displays a modal when the end-user saves an open accordion. Visible when Display Inline Rows is ON.
Hide Table When Empty
hideTableWhenEmpty
Toggle
OFF
Hides the table grid when there are no rows.
Data Settings
Data Storage
Setting
Field
Type
Default
Description
Store Data in Database
persistent
Toggle
ON
When set to ON, this setting this setting stores field values to the database when the module saves, end-users navigate between Panel components, or end-users navigate between workflow screens. Set to OFF to exclude this field from server-side submissions.
Note: Fields with Store Data in Database set to OFF are excluded from Plug-In component's API responses and Unqork's built-in tracker. When using a Plug-In component to remote-execute a module, any component whose value must be included in the API response requires Store Data in Database set to ON.
Data Source
Setting
Field
Type
Default
Description
Data Reference key
dataReferenceKey
Text input
—
An optional reference to another data source.
Component Reference Key
componentReferenceKey
Text input
—
An optional reference to populate the component data.
Yes/No Reference Key
yesNoReferenceKey
Text input
—
An optional reference to another data source for Yes/No question data.
Filter Field
filterField
Text input
—
The Property ID of the component whose value filters the grid list.
Filter Yes/No Component
questionFilterComponent
Text input
—
The Property ID of the component whose value filters the Yes/No list.
Display
Defines the columns displayed in the grid.
Column
Field
Description
ID
id
The property ID of the field to display in this column.
Heading
heading
The column header label.
Yes/No Question Listing
Defines the Yes/No questions displayed when Show Yes/No Instead of Delete/Edit is ON.
Column
Field
Description
Code
code
The stored value for this question.
Text
text
The question text displayed to end-users.
Required
required
When checked, this setting marks the question as required.
Tooltip
tooltip
Tooltip text for this question.
Sub Header
subheader
A sub-header displayed above this question.
Actions Settings
Triggers
Setting
Field
Type
Default
Description
New Row Trigger
newRowTrigger
Property ID
—
Triggers a component when the end-user adds a new row.
Edit Row Trigger
editRowTrigger
Property ID
—
Triggers a component when the end-user edits a row.
Validation Settings
User Input
Setting
Field
Type
Default
Description
Required
validate.required
Toggle
OFF
Requires at least one row before the module can be submitted.
Required Error Message
errors.required
Text input
is required
Displays when the required grid has no rows.
Advanced Settings
Additional Validation Options
Setting
Field
Type
Default
Description
Error Title
errorTitle
Text input
Oops - {( errors )} error(s) have been found!
The heading of the validation error dialog.
Error Message
errorMessage
Text input
Please check your module and fix fields outlined in red.
The body text of the validation error dialog.
Minimum Length
validate.arrayMinLength
Number input
—
The minimum number of rows required.
Maximum Length
validate.arrayMaxLength
Number input
—
The maximum number of rows allowed.
Additional Styling
Setting
Field
Type
Default
Description
custom CSS class
customClass
Text input
—
A CSS class applied to the component for custom styling.
Add Button Icon Class
addButtonIconClass
Text input
—
A CSS icon class for the Add button (for example, fa fa-plus).
Edit Button Icon Class
editButtonIconClass
Text input
—
A CSS icon class for the Edit button (for example, fa fa-pencil).
Changelog
Date
Change
—
Initial publication.
The browser-based workspace where Creators build, edit, review, and manage Unqork applications. Also referred to as the Unqork platform. The IDE replaces what was previously referred to as UDesigner and Classic Designer, which are considered legacy.
A Property ID is the unique field ID used by Unqork to track and link components in your module.
Label Text conveys what the input component is and what information it displays. Enter the purpose of the corresponding component or field.
The VCS (version control system) Contributor role has permissions to edit modules in a branch. Set contributors during the VCS Create a Branch process.
Label Text conveys what the input component is and what information it displays. Enter the purpose of the corresponding component or field.
The Unqork tool used to build individual modules by placing and configuring components on a canvas.
DOM (Document Object Model) events are signals or notifications that something has occurred or is occurring within a web page, often triggered by user interactions or by the browser itself. These events allow JavaScript to react to changes and interactions on a web page, making it dynamic and interactive.
APIs (application programming interfaces) are a set of protocols and definitions developers use to build and integrate application software. APIs act as the connective tissue between products and services.
A key-value pair is a fundamental data structure where a unique "key" is associated with a specific "value," used for organizing and retrieving data efficiently, like in dictionaries or databases.
The Number data type accepts integer or floating point values. The number data type does not use quotes around numerical values.
Cumulative Layout Shift (CLS) measures how much elements in a webpage shift while using it. Some search engines use the CLS metric to rate a website's accessibility in their search rankings.
Cascading Style Sheets (CSS) is a style sheet language used for presenting how a HTML or XML document looks to end-users.
