Vega Table Operations

Overview

Vega Table operations are the actions the Vega Table component performs. These actions include filtering, adding rows, removing rows, navigating to different table pages, and so on. To control and trigger Vega Table operations, use the Operations Builder tool.

Vega Table Operations List

Below is a list of all supported Vega Table operations you can use to control your Vega Table component. For more information on general Vega Table operation settings, view the Shared Vega Table Operation Settings section.

Settings in the table below might let Creators Also known as Unqork Users, or Designer Users; is anyone who is inside the Unqork platform. select a data type option for a field's value. Unqork recommends using the default option when possible.

Operation Type

Description

Option(s)

TABLE_ADD_COLUMN

Adds a column to the table.

Definitions*: Add one or more component definitions to the new columns.

Unqork recommends using a Data Workflow component to pass a component's JSON definition to this operation.

TABLE_ADD_ROW

Adds an empty row to the table at a specified index.

Target Index*: Enter the row number or value to navigate to.

The first row has an index of 0.

Row Value*: Enter a JSON object containing the values for the new row's object keys.

If no index is specified, a row adds to the bottom of the table.

TABLE_CLEAR

Removes all columns and rows from the table.

Target Key*: Enter the property ID of the Table component this operation will affect.

TABLE_GO_TO_FIRST_PAGE

Navigates to the first page of the table.

Target Key*: Enter the property ID of the Table component this operation will affect.

TABLE_GO_TO_LAST_PAGE

Navigates to the last page of the table.

Target Key*: Enter the property ID of the Table component this operation will affect.

TABLE_GO_TO_NEXT_PAGE

Navigates to the next page of the table.

Target Key*: Enter the property ID of the Table component this operation will affect.

TABLE_GO_TO_PAGE

Navigates to a specific page of the table.

Page Number*: Enter the value to navigate to.

The first page has an index of 0.

TABLE_GO_TO_PREVIOUS_PAGE

Navigates to the previous page of the table.

Target Key*: Enter the property ID of the Table component this operation will affect.

TABLE_SET_PAGE_SIZE

Sets the number of rows displayed on each paginated page.

Page Size*: Enter a value corresponding to the number of rows to display per page.

TABLE_REMOVE_COLUMN

Removes a column from the table.

  • Keys To Remove*: Enter the key/value pair of the column you want to remove. Remove multiple columns at once by clicking the Add Item button and entering a new column key.

  • Remove Corresponding Data: Enter True to remove key/value pairs associated with the column. If the key/value pairs are required, or might be used again, set this field to False.

TABLE_REMOVE_ROW

Removes a specified row(s) from the table.

  • Target Key*: Enter the property ID of the Table component this operation will affect.

  • Target Indexes*: Enter the index value of the row you want to remove. Remove multiple rows by clicking the Add Item button and entering a new row index value.

The first row has an index of 0.

TABLE_RENAME_COLUMN

Rename a column's key and display value.

Keys to Rename*: Enter a JSON object containing the column key and label you want to rename.

For example:

Copy
keysToRename: {
    "firstName": "Name",
    "dob": "Date of Birth",
}

TABLE_SET_ACTION_TOOLBAR_VISIBILITY

Displays or hides the action toolbar(s).

  • Enable Top Toolbar: Enter True to display the Toolbar at the top of the table. Enter or select False to hide it.

  • Enable bottom Toolbar: Enter True to display the Toolbar at the bottom of the table. Enter or select False to hide it.

TABLE_SET_COLUMN_FILTERS_VISIBILITY

Displays or hides the column filter toolbar.

Enter Column Filters*: Enter True to display the table's toolbar filter fields. Enter or select False to hide it.

TABLE_SET_GLOBAL_FILTER_VISIBILITY

Displays or hides the global filter toolbar.

Enter Global Filter*: Enter True to display the table's toolbar global filtering feature. Enter or select False to hide it.

TABLE_SET_GLOBAL_FILTER

Filters all columns simultaneously.

Filter*: Enter the key value to filter across all columns in the Vega Table component.

TABLE_SET_ALL_ROWS_EXPANDED

Expand or collapse all rows in the table.

  • Are Rows Expanded*: Enter True to expand the row, or False to collapse the row.

  • Persist: Enter True to retain the expanded rows when other changes occur. Or, enter False to collapse the rows when other changes occur.

TABLE_SET_COLUMN_FILTER

Filters one or more columns.

Filters*: Contains one or multiple Column Filter fields to filter the column by. Click Add Item to add additional filters:

  • Id*: Enter the Column ID of the filter.

  • Value*: Enter the value of the column's filter.

TABLE_SET_COLUMN_PINNING

Pins a column of the table.

Column Pinning State: These settings control which columns are pinned to the left or right of the table.

  • Left: Click Add Item and enter a column's key/value pair to pin it to the left of the table. Pin multiple columns by clicking the Add Item button and entering another column key/value pairs.

  • Right: Click Add Item and enter a column's key/value pair to pin it to the right of the table. Pin multiple columns by clicking the Add Item button and entering another column key/value pair.

TABLE_SET_COLUMN_VISIBILITY

Displays or hides a column of the table.

  • Column*: Enter the key value of the column to hide. Hide multiple columns at once by clicking the Add Item button and entering another column key.

  • Visibility*: Enter or select one of three visibility options:

  • HIDDEN: Hides the column(s).

  • VISIBLE: Displays the column(s).

  • TOGGLE: Switches the current visibility.

  • If any of the provided columns are invalid or do not exist, the operation stops.

  • If no columns are provided, an error displays.

  • targetKey, column and visibility support interpolation syntax.

TABLE_SET_FILTER_TYPES

Offers additional control over filtering columns by data type.

Filters*:The Filters setting contains Column Filter Type options. To add additional filters, click the Add Item button.

  • Id*: Enter the column ID where you want to apply the filter type.

  • Type*: Select the filter type you want to apply to the column.

Filter Types include:

Learn more about each filter type's settings in the Filters Types and Options section.

TABLE_SET_GROUPING_CRITERIA

Sets row grouping in the table.

Group By*: Enter the column label value to group the table by. Group the table by multiple columns by clicking the Add Item button and entering multiple column labels.

TABLE_SET_NAVIGATE_DOWN_ON_PRESS_ENTER

When the table is in edit mode, change the navigation behavior to move down cells when the end-user presses the Enter key.

Enabled*: Enter True to change the navigation method to move down a cell row when the end-user presses the Enter (Return) key on their keyboard. Set the value to False to return to the regular navigation method.

TABLE_SET_ROW_DENSITY

Set the amount of padding around cell content for the entire table.

Row Density*: Enter a padding value. The number adds spacing around the cell in px.

TABLE_SET_ROW_EXPANDED

Expand or collapse a parent row group.

  • Target Group Row*: Enter the parent group row's value.

  • Is Row Expanded*: Enter True to expand the row or False to collapse it.

TABLE_SET_ROW_PINNING

Pins a row of the table.

Row Pinning State: These settings control which rows are pinned to the top or the bottom of the table.

  • Top: Click Add Item and enter a row key/value pair to pin it to the top of the table. Pin multiple rows by clicking the Add Item button and entering another row key/value pair.

  • Bottom: Click Add Item and enter a row key/value pair to pin it to the bottom of the table. Pin multiple rows by clicking the Add Item button and entering another row's key/value pair.

The first row has an index of 0.

TABLE_SET_SELECTED_ROW

Highlights the selected row of the table.

Selected Rows*: Highlight a specific row of the table by using the following JSON: {[rowIndex: string]: Boolean}.

TABLE_SORT_BY_COLUMN

Sort a column in the Vega Table.

Sorting State: Sort a column using its key/value pair. Sort multiple columns at once by clicking the Add Item button and entering a new column key/value pair.

  • Id*: Enter the column key/value pair.

  • Desc: Set to Checked Box Icon (checked) to sort the column in descending order. Set to ☐ (unchecked) to sort the column in ascending order.

    By default, this setting is ☐ (unchecked).

TABLE_TOGGLE_GROUPING

Enables or disables grouping.

Target Key*: Enter the property ID of the Table component this operation will affect.

Shared Vega Table Operation Settings

These settings are present in every Vega Table operation.

Setting

Description

Summary

Describe the purpose of the operation. This field does not display in Express View Express View is how your end-user views your application. Express View also lets you preview your applications to test your configuration and view the styling. This is also the view your end-users will see when interacting with your application. After configuring a module, click Preview in the Module Builder to interact with the module in Express View..

Should Execute

Select the execution method from the drop-down.

Methods include:

  • String: Enter a value to execute.

  • Boolean: Set to Checked Box Icon (checked) for true, or set to ☐ (unchecked) for false.

  • Dynamic: Enter a dynamic value to execute.

By default, this setting is set to Boolean and Checked Box Icon (true).

Target Key*

Enter the property ID of the Table component, or a dynamic value this operation will affect.

Table Set Filters Types and Options

The TABLE_SET_FILTER_TYPES operation enables granular control over a Vega Table component's column filtering feature. Creators can specify the filter type to use for each column, and control its effects. For example, you could limit the filter options for a column containing a drop-down list, or limit the minimum and maximum range values of a column displaying the number data type.

Filter Types

The list below includes a description and available options for each filter type available to the TABLE_SET_FILTER_TYPES filter:

Filter Types Description Option Values

checkbox

Filters column by Boolean values.

Useful for filtering data from a Single Checkbox component.

Include Blanks in Filter: Set to Checked Box Icon (checked) to include rows with blank values in the filter results.

text

Filter columns by a text string value.

Useful for filtering data from a Text Field component.

Include Blanks in Filter: Set to Checked Box Icon (checked) to include rows with blank values in the filter results.

Allow Filter Blank: Set to Checked Box Icon (checked) to allow blank data values to be entered in the toolbar filter's field.

For the text filter, this setting also lets End-users filter for blank values by entering (blanks) in the filter field.

select

Filters column by drop-down values where the end-user can select a single value.

Useful for filtering data values from a Dropdown, Simple Select, or Search Select component.

Use Faceted Values:
  • When Checked Box Icon (checked), the Vega Table generates filter options for end-users using the unique values contained in the data.

  • When, ☐ (unchecked), Creators manually enter a label and value for each option in the Filter Options list.

    Filter Options display a label to the end-user, and filter for the value specified by the Creator. To add more than one filter option, click Add Item. The following fields are available in each filter option:

    • Label: The value that displays to the End-User in Express View.

    • Value: The value the filter searches for.

multi-select

Filters column by drop-down values that allow end-users to select multiple values.

Useful for filtering data fields from a Checkboxes, Simple Select, or Search Select component containing multiple values.

Use Faceted Values:
  • When Checked Box Icon (checked), the Vega Table generates filter options for end-users using the unique values contained in the data.

  • When, ☐ (unchecked), Creators manually enter a label and value for each option in the Filter Options list.

    Filter Options display a label to the end-user, and filter for the value specified by the Creator. To add more than one filter option, click Add Item. The following fields are available in each filter option:

    • Label: The value that displays to the End-User in Express View.

    • Value: The value the filter searches for.

range-slider

Filters column by number values and presents as a slider to the end-user. Creators can set the minimum and maximum values end-users can filter by.

Useful for filtering data from a Number component.

  • Min: Enter the minimum number value end-users can search for.

  • Max: Enter the maximum number value end-users can search for.

  • Step: Controls the slider's movement in increments. For example, if a slider is set to values between 0 and 1000, and you set the Step to 100, then the slider moves in 100 point increments from 0 to 1000 (100, 200, 300, and so on).

  • Include Blanks in Filter: Set to Checked Box Icon (checked) to include rows with blank values in the filter results.

date-range

Filters column by date value and allows Creators to specify the date format that displays in the Vega Table's filter tool bar.

Useful for filtering data from a Date Input component.

Date Format: Specify how dates arrange and display to the end-user End-users, also known as Express Users, are the individuals accessing an application through Express View. In most cases, end-users are the customers using the product..

For best results, match the date format to the Date component or date field used with this filter.

Include Blanks in Filter: Set to Checked Box Icon (checked) to include rows with blank values in the filter results.

range

Filters column by number values and present as a minimum and maximum field to the end-user.

Useful for filtering data from a Number component.

Include Blanks in Filter: Set to Checked Box Icon (checked) to include rows with blank values in the filter results.

Resources