Table element is a data repeater element. The elements you add to the columns in the first row of the element will repeat in the following rows depending on the data source. After selecting the data source, you can also link to other elements in the row/column by selecting the fields in the related data table.
Table Properties
It covers the functionality, appearance and interaction settings for the table in general.
- Datasource: Specifies the dataset to which the table is linked.
- Showheader: Determines whether to show the table's headers.
- Fixed header: Keeps the headers fixed even if the page is scrolled.
- Editable: Specifies whether the table is editable.
- Editable Always Active: Ensures that the cell editing mode is always on.
- Table Width Mode: Determines whether the table width is fixed or as much as the content.
Global Search, Searchable, Sorter and Filtering features are only supported in web applications.
- Globalsearch: Allows global search on all table data.
- Searchable: Allows the search box to be displayed at the top right.
- Should Search Onchange: Allows instant filtering as you type in the search box.
- Searchdelay: Determines the waiting time before searching (milliseconds).
- Sorter: Enables sorting of columns.
Filtering options are specific to the column's data type and only work on data-linked tables.
- Filtering: Allows filtering columns by data type. In the Table element, it offers different filtering options according to the data type of the columns (String, Number or Date). For example, when one of the options such as contains, equals, begins with is selected for String columns, a column-based filter can be applied according to this option. The options are specific to the column type. Filtering is active after three letters and the search is automatically refreshed when each letter is entered, thus providing a more dynamic and faster filtering.
- Pagination: Allows data to be divided into pages.
- Pagesize: Determines the number of lines to be displayed on each page.
- Show Size Changer: Allows the user to change the page size.
- Size Changer Options: Sets the page size selection options (e.g. 10, 20, 50).
- Columnchooser: Allows the user to select which columns are visible or not.
- Resizable columns: Allows the width of the columns to be adjusted.
- Hidetableonempty: Allows the table to be hidden if there is no data.
- Striped: Makes the rows appear striped.
- Stripedcolor: Sets the background color of the rows in striped view.
- Rowhoverbgcolor: Changes the background color when the row is hovered over.
- Insertrowactive: Activates the new row insertion feature.
- Insertrowpositon: Determines whether the new row will be inserted at the top or bottom.
- Shownodatafound: Shows “no data found” message if there is no data.
- Nodatafoundmessage: Allows you to customize the content of this message.
- Nodatafoundimage: Sets the image to be shown when there is no data.
- Multiselect: Allows to select more than one row at the same time.
- Transformed on Mobile Resolution: On mobile resolution, table elements are rearranged and optimized for better viewing.
- Multiselect Scope: Sets whether the multiselect will be a cell, row or column.
- Selected values: Holds the values of the selected rows.
- Hide Header on Mobile Resolution: On mobile resolution, table headers are hidden.
- Selected Row Color: Determines the background color of the selected row.
- Export: Activates the ability to export the table (Excel, CSV).
Columns Properties
Properties that appear when the column is selected. Each one controls the appearance, function or behavior of the column.
- Title: The column title is the name that will be displayed to the user.
- Group: Used to group columns in the title.
- Title Bgcolor: Sets the column title background color.
- Specialsortingformat: Allows to process according to a special rule during sorting.
- Always Visible On Mobile Resolution: Makes this column always visible on mobile.
- Hide Filtering: Prevents filtering in this column.
- Hidesorting: Prevents sorting in this column.
- Hidesearch: Hides the search box in this column.
- Footer Options: Allows to add footer information (total, average, etc.) to this column.
- Footerformatter: Defines formatting rules specific to footer information.
- Footer Optionlabel: Determines the title/text to be written in the footer.
- Footer Font Size: Sets the footer font size.
- Footer Font Color: Footer font color.
- Footer Text Align: Footer text alignment (left, right, center).
- Exclude From Export: Prevents this column from being included in the export.
- Fixed: Makes the column fixed (stays in place when scrolled).
- Placeholder: If the cell is editable, this is the text that will be displayed when empty.
Title Properties
It becomes active when the column heading is selected. These properties allow you to edit the column's title field.
- Column Titles: Represents the column titles in the table. They are usually the titles in the first row.
- Hide Mobile Resolution: Allows hiding table titles on mobile.
- Textdirection: Determines the column text direction (left to right / right to left).
