Table
The table object displays data in a tabular format. It can operate in two modes: items mode and datasource mode, which are controlled by the Data Mode attribute.
In items mode, the table's data is populated with a uiSet of the Items attribute.
In datasource mode, the table's data is populated with a connected datasource, set in the Datasource ID attribute. The table's columns are defined in the Columns attribute.
Commands
If a Command Name is specified, the table sends commands to the server when actions are performed.
In items mode, commands are always sent for the following actions: add, edit, delete, move, import.
In datasource mode, a command is always sent for move actions.
For additional information on commands and their parameters, see the Commands attribute.
Attributes
Common
ID
Sets the object's ID.
The ID identifies the object and is used to reference it in UISet actions, allowing to change its attributes dynamically.
The ID is not unique, it can be shared among multiple objects to quickly change a common attribute.
IDs can't be changed with a UISet action, but they can have a Value Binding assigned to them. Value Bindings on IDs allow an object to be dinamically attached to a set of attribute values.
E.g. the following Value Binding switches the ID of the object between mybutton1 and mybutton2 based on the value of the UISet button.address:
Value binding:
="mybutton" + ui('button', 'address')
UISet:
UISet('button', 'address', '1') switches the ID to mybutton1
UISet('button', 'address', '2') switches the ID to mybutton2
Position and Size
Position
Sets the object's position.
The default value is: x0y0.
Attribute Values
| Value | Description | Example |
|---|---|---|
| x<left>y<top> | Specify left/top coordinates in pixels. | x10y20 |
Flex Grow
Specifies if the objects should grow to fill the available space.
The default value is: true.
Attribute Values
| Value | Description |
|---|---|
| true | Default value. Objects expand to fill the available space. |
| false | Objects do not grow to fill the available space. |
Flex Shrink
Specifies if the objects should shrink to fit the available space.
The default value is: true.
Attribute Values
| Value | Description |
|---|---|
| true | Default value. Objects shrink to fit the available space. |
| false | Objects do not shrink to fit the available space. |
Width
Sets the object's width in pixels.
Minimum value is 1.
Height
Sets the object's height in pixels.
Minimum value is 1.
Data
Data Mode
Specifies the object's data mode, which controls the way the table's data is populated.
In items mode, the data is populated with a uiSet of the items attribute.
In this mode, commands are sent to the server for the following user actions: add, edit, move and delete.
The default value is: items.
This attribute is static. Its value can't be changed dynamically with a uiSet command or with a value binding.
Attribute Values
| Value | Description |
|---|---|
| items | Default value. Data is populated using the "items" attribute. |
| datasource | Data is populated with a datasource. |
Datasource ID
The ID of the datasource to which the table is connected.
Attribute Values
| Value | Description |
|---|---|
| [Datasource ID] | The datasource ID as defined on the server. |
Items
Specifies the table's content with an array of arrays (rows, columns).
Attribute Values
| Value | Description | Example |
|---|---|---|
| <array> | The array of rows and columns. | [[1,"one"],[2,"two"]] |
Command Name
Specifies the command name used to send all table related commands (see the Command attribute).
The default value is: =id.
Attribute Values
| Value | Description |
|---|---|
| <string> | Command name. |
Commands
Specifies the set of commands that are sent to the server when the user performs specific actions.
In items mode, the following commands are always sent: add, edit, delete, move.
In datasource mode, the following commands are always sent: move.
Each command is sent with the name specified in the Command Name attribute, or table ID, and a JSON parameter based on the command type.
Commands prefixed with pre- can be be cancelled by the server, for example in case it's not allowed, by adding the cancel property to the JSON reply.
{ "cancel": "true" }
Otherwise the action is performed locally by the client.
All commands involving the edit popup (pre-add, pre-edit, pre-duplicate, edit-change) can also specify a field property in the JSON reply, which applies changes to the edit popup fields. Each field is identified by its name, and the properties are a selection of the column a Note: some attributes trigger a redraw of the edit popup. The following attributes can be specified:
type- the field type (redraws the edit popup)visible- whether the field is visible (redraws the edit popup)value- the value of the fieldenabled- whether the field is enabledplaceholder- the placeholder of the fieldreadonly- whether the field is readonlyitems- the items of a select field in "items" modelist- the items of a select field in "list" modeprefix- the prefix of the fieldsuffix- the suffix of the fieldclearbutton- whether the clear button is visiblerequired- whether the field is requiredfocustooltip- the tooltip of the field when focusederror- the error message of the fielderrortooltip- the tooltip of the error messagemultienabled- if multiple rows are being edited, whether the field is checked for editing
E.g.
{ "fields": { "field1": { "value": "new value", "enabled": "false", "type": "select", ... }, ... } }
All standard command reply parameters are also supported (page, error, etc.). For example, to cancel an edit action and display a modal popup, the server can send:
{ "cancel": "true", "page": "page:error_popup" }
This attribute is static. Its value can't be changed dynamically with a uiSet command or with a value binding.
Attribute Values
| Value | Description |
|---|---|
| pre-add | Sends a command when the user starts adding a row, including the default values of all fields. Command parameter: { "action": "pre-add", "values": { "<field name>": "<value>", ... } }In the JSON reply, the server can specify UISets for specific edit fields attributes: { "fields": { "<field name>": { "value": "value", "enabled": "false", "type":"select", ... }, ... } }This action can be canceled by the server, by specifying in the JSON reply: { "cancel": "true" }Note: this command will block the UI until the server replies. |
| pre-edit | Sends a command when the user starts editing a row, including the row key and the current values of all fields. Command parameter: { "action": "pre-edit", "key": "<row key>", "values": { "<field name>": "<value>", ... } }The key property is the key of the edited row. For multiple row updates, the key property is replaced by the keys property, which is an array of keys: { "action": "pre-edit", "keys": ["<row key>", ...], "values": { "<field name>": "<value>", ... } }For inline edits, an inline property is added to the command parameter: { "action": "pre-edit", "key": "<row key>", "field": "<field name>", "values": { "<field name>": "<value>" }, "inline": "true" }In the JSON reply, the server can specify UISets for specific edit fields attributes: { "fields": { "<field name>": { "value": "value", "enabled": "false", "type":"select", ... }, ... } }This action can be canceled by the server, by specifying in the JSON reply: { "cancel": "true" }Note: this command will block the UI until the server replies. |
| pre-delete | Sends a command when the user starts deleting a row, including the row key. This event is sent only if Delete Confirm is not false. Command parameter: { "action": "pre-delete", "keys": ["<row key>", ...] }The keys property is an array of all the deleted rows' keys. This action can be canceled by the server, by specifying in the JSON reply: { "cancel": "true" }Note: this command will block the UI until the server replies. |
| pre-duplicate | Sends a command when the user starts duplicating a row, including the row key and the current values of all fields. Command parameter: { "action": "pre-duplicate", "key": "<row key>", "values": { "<field name>": "<value>", ... } }The key property is the key of the edited row. For multiple row updates, the key property is replaced by the keys property, which is an array of keys: { "action": "pre-duplicate", "keys": ["<row key>", ...], "values": { "<field name>": "<value>", ... } }In the JSON reply, the server can specify UISets for specific edit fields attributes: { "<field name>": { "value": "value", "enabled": "false", "type": "select", ... }, ... }This action can be canceled by the server, by specifying in the JSON reply: { "cancel": "true" }Note: this command will block the UI until the server replies. |
| add | Sends a command when the user inserts a row (confirms the add). The command parameter is a JSON: { "action": "insert", "data": { "<field name>": "<value>", ... } }The data property is a JSON containing the values of the fields of the inserted row. |
| edit | Sends a command when the user updates a row (confirms the edit). The command parameter is a JSON: { "action": "update", "key": "<row key>", "data": { "<field name>":"<value>", ... } }The key property is the key of the updated row. The data property is a JSON containing the values of the fields of the updated row. For multiple row updates, the key property is replaced by the keys property, which is an array of keys: { "action": "update", "keys": ["<row key>", ...], "data": { "<field name>": "<value>", ... } }For inline edits, an inline property is added to the command parameter: { "action": "update", "key": "<row key>", "field": "<field name>", "value": "<value>", "inline": "true" }. |
| delete | Sends a command when the user confirms the deletion of a row. The command parameter is a JSON: { "action": "delete", "keys": ["<row key>", ...] }The keys property is an array of all the deleted rows' keys. |
| move | Sends a command when the user attempts to move a row. The command parameter is a JSON: { "action": "move", "key": "<row key>", "after": "<row key>" }or { "action": "move", "key": "<row key>", "before": "<row key>" }The key property is the key of the moved row. To specify the position of the row, use either the after or before property. The after property is the key of the row after which the row is moved. The before property is the key of the row before which the row is moved. |
| import | Sends a command when the user imports data from a file. The command parameter is a JSON: { "action": "import", "columns": "<column ids>", "rows": [...] }The columns property is a comma-separated list of column ids. The rows property is an array of arrays, each array representing a row. |
| edit-change | Sends a command when the user changes the value of a field in the add/edit popup. The command includes the row key, the id of the edited field and the current values of all fields, including disabled ones. In multi-edit mode if a field has multiple values (and the field's edit checkbox is not checked), a null value is sent. Command parameter: { "action": "edit-change", "key": "<row key>", "field": "<field name>", "values": { "<field name>": "<value>", ... } }The key property is the key of the edited row. For multiple row updates, the key property is replaced by the keys property, which is an array of keys: { "action": "edit-change", "keys": ["<row key>", ...], "field": "<field name>", "values": { "<field name>": "<value>", ... } }For inline edits, an inline property is added to the command parameter: { "action": "edit-change", "key": "<row key>", "field": "<field name>", "value": "<value>", "inline": "true" }In the JSON reply, the server can specify UISets for specific edit fields attributes: { "fields": { "<field name>": { "value": "value", "enabled": "false", "type":"select", ... }, ... } }. |
| filter | Sends a command when the user changes the filter. Command parameter: { "action": "filter", "filter": "<filter>" }For column filters: { "action": "filter", "column": "<column index>", "columnFilters": { "": "<filter>" }. |
| select | Sends a command when the user changes the selected rows. Command parameter: { "action": "select", "keys": [...] }The keys property is an array of all the selected rows' keys. |
| sort | Sends a command when the user changes the sort. Command parameter: { "action": "sort", "column": "<column index>", "direction": "asc|desc", "caseSensitive": "<true|false>" }The column property is the index of the column that is sorted. The direction property is the sort direction. The caseSensitive property is true if the sort is case sensitive. The sort is always local, but this command is useful in case the table is showing only a subset of the data, and the server needs to know the current sort order to return the correct data. |
| row-click | Sent only when rowaction is set to command.Sends a command when the user clicks on a row. Command parameter: { "action": "row-click", "key": "<row key>" }The key property is the key of the clicked row. |
Columns
Columns
Specifies the table's columns.
For the full item reference, see Table Column.
Attribute Values
| Value | Description | Example |
|---|---|---|
| <JSON array> | A JSON defining the columns. | [{"label":"Temperature","dataindex":"0","width":"120"}] |
Frozen Left
Freezes a specified number of columns on the left.
Frozen columns won't move horizontally when the content of the table is scrolled and will overlap scrolling columns.
Columns that have the Hidden attribute set to false are not counted, so for
example if the first column is hidden, Frozen Left = 1 will freeze the second
column.
Columns with a variable Hidden attribute (e.g. it has value binding or it's set to edit etc.),
are counted as visible columns
Minimum value is 0.
The default value is: 0.
Attribute Values
| Value | Description |
|---|---|
| <int> | The number of columns to freeze. |
Frozen Right
Freezes a specified number of columns on the right.
Frozen columns won't move horizontally when the content of the table is scrolled and will overlap scrolling columns.
Columns that have the Hidden attribute set to false are not counted, so for
example if the last column is hidden, Frozen Right = 1 will freeze the second
column.
Columns with a variable Hidden attribute (e.g. it has value binding or it's set to edit etc.),
are counted as visible columns
Minimum value is 0.
The default value is: 0.
Attribute Values
| Value | Description |
|---|---|
| <int> | The number of columns to freeze. |
Resizable Columns
Specifies if the columns can be resized by the user.
The default value is: false.
Attribute Values
| Value | Description |
|---|---|
| false | Default value. Columns can't be resized. |
| true | Columns can be resized. |
| save | Columns can be resized and the new size is stored locally (in the localStorage of the browser). |
Sortable
Specifies if the table's rows are sortable by column.
A command is sent if sort is specified in the Extra Commands attribute.
This is useful for example when the table is showing only a subset of the data, and the server needs to know the current sort order to return the correct data.
The default value is: false.
Attribute Values
| Value | Description |
|---|---|
| false | Default value. Rows can't be sorted. |
| true | Rows can be sorted. |
Sort Column
Specifies the index of a column to apply a local sort. Hidden columns are counted too.
Minimum value is 0.
The default value is: 0.
Attribute Values
| Value | Description |
|---|---|
| <int> | The index of the column to be sorted. |
Sort Direction
If "Sort Column" is specified, specifies the sort order to apply a local sort.
The default value is: none.
Attribute Values
| Value | Description |
|---|---|
| none | Default value. Not sorted. |
| asc | Sorted in ascending order. |
| desc | Sorted in descending order. |
Case Sensitive Sort
Specifies whether the local sort is case sensitive.
The default value is: false.
Attribute Values
| Value | Description |
|---|---|
| false | Default value. Case insensitive. |
| true | Case sensitive. |
Rows
Row Height
Row height in pixels.
The default value is: 26.
This attribute is experimental. It might not work properly and it might be modified or removed in a future release.
Attribute Values
| Value | Description | Example |
|---|---|---|
| <integer> | Row height in pixels. | 30 |
Row CSS Class Field
Specifies a data field used to customize row appearance. The field's value is applied as a CSS class. Custom CSS Classes are specified within the ()[custom.css] file.
This attribute is experimental. It might not work properly and it might be modified or removed in a future release.
Attribute Values
| Value | Description | Example |
|---|---|---|
| <index> | If the data mode is items, this is the index of the column in items, that will be used as CSS class. | 0 |
| <name> | If the data mode is datasource, this is the name of the column in the specified datasource, that will be used as CSS class. | name |
Row Action
Specifies the action to perform when a row is clicked.
If a cell is selectable or already has an action (e.g. button, switch...), the row action is not triggered when clicking on the cell.
The default value is: auto.
Attribute Values
| Value | Description |
|---|---|
| auto | Default value. Select the row, if there's a selection column. |
| edit | Edit the row. Enabled only in edit mode. |
| inline-edit | Edit the cell inline. Enabled only in edit mode. |
| select | Select the row. |
| command | Send a command with the name specified in the Command Name attribute and { "action": "row-click", "key": "<row key>" } as parameter.Check the Commandsattribute for more information. |
| none | No action. |
Selection
Specifies the list of selected rows' key values.
Attribute Values
| Value | Description |
|---|---|
| <comma-separated list> | List of key values to select. |
Edit Options
Edit Mode
Controls the edit mode. When edit mode is true, the edit, add, delete, import buttons appear (both in the bottom toolbar and in the columns, if defined).
The default value is: false.
Attribute Values
| Value | Description |
|---|---|
| false | Default value. Edit not enabled. |
| true | Edit enabled. |
| toggle | Edit mode can be toggled by the user. |
Add Enabled
Specifies if the user can add items.
The default value is: true.
Attribute Values
| Value | Description |
|---|---|
| true | Default value. Adding items is enabled. |
| false | Adding items is disabled. |
Edit Enabled
Specifies if the user can edit items.
The default value is: true.
Attribute Values
| Value | Description |
|---|---|
| true | Default value. Editing items is enabled. |
| false | Editing items is disabled. |
Multi Edit Enabled
Specifies if the user can edit multiple items.
The default value is: true.
Attribute Values
| Value | Description |
|---|---|
| true | Default value. Editing multiple items is enabled. |
| false | Editing multiple items is disabled. |
Delete Enabled
Specifies if the user can delete items.
The default value is: true.
Attribute Values
| Value | Description |
|---|---|
| true | Default value. Deleting items is enabled. |
| false | Deleting items is disabled. |
Delete Confirm
Requires a confirmation before deleting the item(s).
The default value is: false.
Attribute Values
| Value | Description |
|---|---|
| false | Default value. No confirmation, the item(s) is deleted right away. |
| doubleclick | A second click (or touch or enter key) is required to confirm the deletion. |
| popup | A popup is displayed to ask for confirmation. |
Delete Confirm Message
The confirmation message to be displayed if the "confirm" attribute is set to "popup".
Attribute Values
| Value | Description | Example |
|---|---|---|
| <string> | The message to be displayed in the confirm popup. | Are you sure? |
Move Enabled
Specifies if the user can move items.
The default value is: true.
Attribute Values
| Value | Description |
|---|---|
| true | Default value. Moving items is enabled. |
| false | Moving items is disabled. |
Import Enabled
Specifies if the user can import items from a CSV file.
The default value is: true.
Attribute Values
| Value | Description |
|---|---|
| true | Default value. Import is enabled. |
| false | Import is disabled. |
Export Enabled
Specifies if the user can export items to a CSV file.
The default value is: true.
Attribute Values
| Value | Description |
|---|---|
| true | Default value. Export is enabled. |
| false | Export is disabled. |
Edit Popup
Edit Popup Width
Specifies the edit popup's width in pixels.
Minimum value is 0.
The default value is: 300.
This attribute is experimental. It might not work properly and it might be modified or removed in a future release.
Attribute Values
| Value | Description |
|---|---|
| <int> | Width in pixels. |
Edit Popup Field Width
Specifies the width of the edit popup's fields in pixels.
Minimum value is 0.
The default value is: auto.
This attribute is experimental. It might not work properly and it might be modified or removed in a future release.
Attribute Values
| Value | Description |
|---|---|
| <int> | Width in pixels. |
Display Required Fields
Displays a symbol next to required fields' labels on the add/edit popup.
The default value is: true.
This attribute is experimental. It might not work properly and it might be modified or removed in a future release.
Attribute Values
| Value | Description |
|---|---|
| true | Default value. Display. |
| false | Hide. |
Toolbar
Item Label
Specifies a label to use when referring to the items. It's used in the bottom toolbar for the item count and elsewhere Singular and plural words can be specified by separating them with a pipe character ("|")
The default value is: item|items.
This attribute is static. Its value can't be changed dynamically with a uiSet command or with a value binding.
Attribute Values
| Value | Description | Example |
|---|---|---|
| <string> | The item labels. | `person |
Show Item Count
Shows the item count in the bottom toolbar.
The default value is: true.
Attribute Values
| Value | Description |
|---|---|
| true | Default value. Show. |
| false | Hide. |
Show Top Bottom Buttons
Shows up/down buttons to scroll the table to the top/bottom.
The default value is: false.
Attribute Values
| Value | Description |
|---|---|
| true | Show. |
| false | Default value. Hide. |
Filter
Filter
Displays an input field for filtering the items. After typing a value in the field or setting the Filter Value attribute, any item that does not match the input will be hidden. A match occurs when the filter value is found anywhere within any item's fields ('value', 'label', etc). Hidden columns are skipped. Individual columns can specify if they should be included in the filter or if the filter applies to the original/formatted value with the format attribute.
The default value is: false.
Attribute Values
| Value | Description |
|---|---|
| false | Default value. Hides the filter field. |
| true | Display the filter field. |
| toggle | User can toggle the filter field's visibility. |
Filter Placeholder
Specifies a short hint that is displayed in the filter field before the user enters a value. Describes the expected value of an input field (e.g. a sample value or a short description of the expected format)
Attribute Values
| Value | Description |
|---|---|
| <string> | A short hint. |
Filter Value
Specifies a string used as filter value. It's applied even if the filter field is hidden.
Attribute Values
| Value | Description | Example |
|---|---|---|
| <string> | The filter string. | Jan 2015 |
Column Filters
Displays input fields on each column that filter the items.
The default value is: false.
Attribute Values
| Value | Description |
|---|---|
| false | Default value. Hides the columns' filter fields. |
| true | Display the columns' filter fields. |
| toggle | User can toggle the columns' filter fields visibility. |
Column Filters Value
Specifies the values of the per-column filters as a comma-separated list. Each value is matched to a declared column by position, so hidden columns still occupy a position in the list.
This attribute is applied even if the column filter fields are not visible. However, when filtering rows, only visible columns are evaluated. Values assigned to hidden columns are ignored. Matching is case-insensitive.
A column with Filter=false is always excluded from filtering.
Individual columns can also specify whether the filter applies to the original or formatted value with the Filter column attribute.
Attribute Values
| Value | Description |
|---|---|
| <comma-separated list> | List of filter values by declared column order. Hidden columns still take a position in the list, even though their values are not used for matching. |
Column Filters Preset
Specifies a hidden base filter that is applied before the user-defined filters. It is always active and is not shown in the column filter fields.
Like Column Filters Value, this attribute is a comma-separated list mapped by declared column position, so hidden columns still occupy a position in the list.
Unlike Column Filters Value, preset filters are also applied to hidden columns.
Matching is case-insensitive.
This makes it possible to restrict the table using data that is not shown to the user.
A column with Filter=false is still excluded from preset filtering.
Attribute Values
| Value | Description |
|---|---|
| <comma-separated list> | List of preset filter values by declared column order. Hidden columns still take a position in the list and their values are also used for matching. |
Import/Export
Import Preview
Displays a popup that previews how data is interpreted. It shows the number of items that will be inserted, updated, deleted, skipped and shows errors.
Note: the preview is based on the current datasource data set. It may not be accurate if the data set is filtered server side.
The default value is: true.
Attribute Values
| Value | Description |
|---|---|
| false | False. |
| true | Default value. True. |
Import Settings
Shows a settings option on the preview popup, that allows the user to configure how the file is parsed.
User settings have the priority over the initial settings.
The default value is: false.
Attribute Values
| Value | Description |
|---|---|
| false | Default value. False. |
| true | True. |
Export Filename
Specifies the filename of the exported CSV file, without path or extension.
The default is "table_<id>_<date>" where id is from either the object or the datasource.
CSV Separator
Specifies the CSV separator.
The default value is: ,.
Attribute Values
| Value | Description | Example |
|---|---|---|
| <character> | A single character. | ; |
CSV Enclose
Specifies the CSV enclose character.
The default value is: ".
Attribute Values
| Value | Description | Example |
|---|---|---|
| <character> | CSV enclose character. | ' |
CSV Escape
Specifies the CSV escape character.
The default value is: ".
Attribute Values
| Value | Description | Example |
|---|---|---|
| <character> | Escape character. | \ |
CSV New Line
Specifies the CSV new line character.
The default value is: \n.
Attribute Values
| Value | Description | Example |
|---|---|---|
| <string> | New line character. | \r\n |
Styling
Panel
Shows a panel that frames the object. Its style can be modified.
The default value is: true.
Attribute Values
| Value | Description |
|---|---|
| true | Default value. Shows the panel. |
| false | Hides the panel. |
Panel Color
Specifies the panel color.
The default value is: default.
Attribute Values
| Value | Description |
|---|---|
| default | Default value. Default color. |
| primary | Primary color, used to highlight important areas. |
| warning | Warning color, used to highlight warning areas. |
| success | Success color, used to highlight success areas. |
| error | Error color, used to highlight error areas. |
| red,blue,yellow,green,yellow,purple,orange,green | Palette colors. |
| custom | Custom color, defined in the "Custom Color" attribute. |
Panel Custom Color
Specifies the panel custom color.
Attribute Values
| Value | Description | Example |
|---|---|---|
| <html color> | Color in any html accepted format. | #ff0000 |
Header
Displays the column header.
The default value is: true.
Attribute Values
| Value | Description |
|---|---|
| false | False. |
| true | Default value. True. |
Borders
Displays vertical and/or horizontal borders on every cell.
The default value is: none.
Attribute Values
| Value | Description |
|---|---|
| none | Default value. No borders. |
| vertical | Vertical borders. |
| horizontal | Horizontal borders. |
| both | Both vertical and horizontal borders. |
Striped
Adds zebra-striping to rows.
The default value is: false.
Attribute Values
| Value | Description |
|---|---|
| false | Default value. False. |
| true | True. |
Cell Background
Specifies the default cell's background color. Specific background colors can be set for a whole column or for specific cells (JSON Value = true or with Attribute bindings).
Attribute Values
| Value | Description | Example |
|---|---|---|
| <html color> | Color in any html accepted format. | #ff0000 |
Header Cell Background
Specifies the header, summary cells' background color.
Attribute Values
| Value | Description | Example |
|---|---|---|
| <html color> | Color in any html accepted format. | #ff0000 |
Fixed Cell Background
Specifies the fixed cells' background color.
Attribute Values
| Value | Description | Example |
|---|---|---|
| <html color> | Color in any html accepted format. | #ff0000 |
Cell Border Color
Specifies the cell's border color.
Attribute Values
| Value | Description | Example |
|---|---|---|
| <html color> | Color in any html accepted format. | #ff0000 |
Highlight Rows
Highlights rows on mouse over. Not available with touch devices.
The default value is: false.
Attribute Values
| Value | Description |
|---|---|
| false | Default value. No higlight. |
| true | Highlight on mouse over. |
Highlight Selected Rows
Highlights selected rows.
The default value is: false.
Attribute Values
| Value | Description |
|---|---|
| false | Default value. No higlight. |
| true | Highlight selected rows. |
View
Visible
Sets the object's visibility.
The default value is: true.
Attribute Values
| Value | Description |
|---|---|
| true | Default value. Visible. |
| false | Hidden. |
Enabled
Specifies if the object is enabled or disabled. A disabled object appears as grayed out and can't be interacted with.
The default value is: true.
Attribute Values
| Value | Description |
|---|---|
| true | Default value. Enabled. |
| false | Disabled. |
Blink
Blinks the object at the specified speed.
The default value is: false.
Attribute Values
| Value | Description |
|---|---|
| false | Default value. Not blinking. |
| slow | Blinks slowly. |
| fast | Blinks fast. |
Transition
Specifies the transition effect when the object is shown or hidden.
The default value is: none.
This attribute is experimental. It might not work properly and it might be modified or removed in a future release.
Attribute Values
| Value | Description |
|---|---|
| none | Default value. No transition. |
| fade | Fade in/out. |
| fade-left | Slide from left and fade in/out. |
| fade-right | Slide from right and fade in/out. |
| fade-up | Slide from top and fade in/out. |
| fade-down | Slide from bottom and fade in/out. |
| slide-left | Slide from left. |
| slide-right | Slide from right. |
| slide-up | Slide from top. |
| slide-down | Slide from bottom. |
| zoom-in | Zoom in. |
| zoom-out | Zoom out. |
| 3d-flip-left | 3D flip from left. |
| 3d-flip-right | 3D flip from right. |
Transition Duration
Specifies the transition duration in milliseconds.
The default value is: 300.
This attribute is experimental. It might not work properly and it might be modified or removed in a future release.
Attribute Values
| Value | Description |
|---|---|
| <integer> | Duration in milliseconds. |
Transition Delay
Specifies the transition delay in milliseconds.
The default value is: 0.
This attribute is experimental. It might not work properly and it might be modified or removed in a future release.
Attribute Values
| Value | Description |
|---|---|
| <integer> | Delay in milliseconds. |
Opacity
Sets the object's opacity. Opacity is the degree to which content behind an object is hidden.
The default value is: 1.0.
Attribute Values
| Value | Description |
|---|---|
| 0 | The object is fully transparent. |
| >0.0, <1.0 | The object is translucent (content behind the element can be seen). |
| 1.0 | Default value. The object is fully opaque. |
Rotation
Specifies the degrees by which the object is rotated. A positive number rotates it clockwise, while a negative value rotates it counter-clockwise.
The default value is: 0.
CSS Class
Specifies a CSS Class that applies to the object, useful to customize its appearance. Custom CSS Classes are specified within the custom.css file.
Margin
Specifies the margin of the object. The margin is the space outside the object's border.
This attribute is experimental. It might not work properly and it might be modified or removed in a future release.
Attribute Values
| Value | Description | Example |
|---|---|---|
| <int> | Specify the margin in pixels for all sides of the object. | |
| <top> <right> <bottom> <left> | Specify the margin in pixels for each side of the object. | 10 20 30 40 |
View Scale
Specifies the scale of the object. The scale is the ratio between the object's size and the size of the view it is contained in.
The default value is: 1.0.
This attribute is experimental. It might not work properly and it might be modified or removed in a future release.
Attribute Values
| Value | Description |
|---|---|
| <float> | Specify the scale for both width and height of the object. |
Meta
Comment
Specifies a comment, visible only in the Project Editor. It can be used to add a note or a tag to the object. The filter in the object's SELECT panel applies to the comment as well.
This attribute is static. Its value can't be changed dynamically with a uiSet command or with a value binding.
Exclude
Excludes the object from the UI. Useful to temporarily hide an object without deleting it. Different from the "Visible" attribute, which hides the object in the UI but keeps it in the project, allowing it to be shown again with a UISet.
The default value is: false.
This attribute is static. Its value can't be changed dynamically with a uiSet command or with a value binding.
Attribute Values
| Value | Description |
|---|---|
| false | Default value. Object is included in the UI. |
| true | Object is excluded from the UI. |