« Back to Product

Documentation

Tree

Require: IP-Symcon >= 5.0

Creates a tree with the caption caption.
The displayed columns are defined in columns.
Initial entries in the tree can be specified via values.

Example
Warning

This item is not supported by the Legacy Console. If a module with this element is opened in the legacy console, an error message appears.

General Parameters

Parameter Description
add (optional) (default: false) If true, an "Add" button is displayed below the table, which adds a new element to the tree under the selected node
caption (optional) Visible caption of the tree
columns Columns of the tree
delete (optional) (default: false) If true, a button is displayed behind each entry of the tree, which deletes the corresponding element
download (optional) (default: "") If this parameter is not an empty string and the output of the onAdd, onDelete, onEdit or onExpand script is a Data-URL, the output is downloaded as a text file with the name of the download parameter. (since IP-Symcon 7.0)
form (optional) (default: based on the "edit" parameters of column) An individual form for editing or adding rows. The definition of the form is done analogously to the definition of the form for Actions either static or via PHP code. The usage of the form is done analogously to the same parameter of the List (since IP-Symcon 7.0)
link (optional) (default: false) If this parameter is true, the output of the onAdd, onDelete, onEdit and onExpand script is opened as a link. If it is false, the output is displayed as a dialog in the configuration form. (since IP-Symcon 6.0)
name (optional) Name of the tree
onAdd (optional) (default: "") Script which is executed after adding an entry to the tree. If the script consists of several lines, the individual lines can also be defined as an array (arrays are supported from version 6.0). In this version, the tree does not offer the currently selected entry as the variable value but the added entry, see Use of the tree content in on-actions. Otherwise it has the same properties as onClick of the Button (since IP-Symcon 5.3)
onDelete (optional) (default: "") Script which is executed after deleting an entry of the tree. If the script consists of several lines, the individual lines can also be defined as an array (arrays are supported from version 6.0). In this version, the tree does not offer the currently selected entry as the variable value but the deleted entry, see Use of the tree content in on-actions. Otherwise it has the same properties as onClick of the Button (since IP-Symcon 5.3)
onEdit (optional) (default: "") Script which is executed after editing an entry of the tree. If the script consists of several lines, the individual lines can also be defined as an array (arrays are supported from version 6.0). In this version, the tree does not offer the currently selected entry as the variable value, but the edited entry, see Use of the tree content in on-actions. Otherwise it has the same properties as onClick of the Button (since IP-Symcon 5.3)
onExpand (optional) (default: "") Script which is executed after expanding an entry of the tree. If the script consists of several lines, the individual lines can also be defined as an array. In this version, the tree does not offer the currently selected entry as the variable value, but the expanded entry, see Use of the tree content in on-actions. Otherwise it has the same properties as onClick of the Button (since IP-Symcon 6.4)
rowCount (optional) (default: 0) visible number of lines; If there are more lines in the tree, a scroll bar is displayed - if the value is 0, the tree fills the remaining space available in the instance editor. Only one configuration item can get all of the remaining space.
sort (optional) Sorting of the tree. If this is not set, the tree is sorted according to the identifiers of the nodes
type Tree
values (optional) Initial entries in the tree
visible (optional) (default: true) If true, the tree is visible, otherwise it is invisible (from IP-Symcon 5.2)
enabled (optional) (default: true) If true, the tree can be used, otherwise it is displayed as deactivated (from IP-Symcon 6.0)
changeOrder (optional) (default: false) If true, the order of the entries can be changed using drag & drop. The sorting of the list according to columns, however, is not possible in that case. (since IP-Symcon 6.0)
loadValuesFromConfiguration (optional) (default: true) This parameter specifies whether to populate the tree with the property's values, see Saving and loading trees. If the value is set to true, it is necessary to fill the tree in the interest of the user for a successful review in the Module Store, see Review guidelines Point 13 (since IP-Symcon 6.0)

Parameters for Columns

Parameter Description
add (optional) Initial value in this column for a newly added entry, necessary if add is set to true on the tree
caption Visible caption of a column
confirm (optional) (default: "") Query text before an onClick action is performed. The action is only carried out if the query is confirmed with "Yes". If no query text is defined, the action is carried out directly (since IP-Symcon 5.2)
download (optional) (default: "") If this parameter is not an empty string and the output of the onClick script of this column is a Data-URL, the output is downloaded as a text file with the name of the download parameter. (since IP-Symcon 7.1)
edit (optional) Description of an editable element
label Visible caption of a column (deprecated)
link (optional) (default: false) If this parameter is true, the output of the onClick script of this column is opened as a link. If it is false, the output is displayed as a dialog in the configuration form. (since IP-Symcon 7.1)
name Unique name of a column to refer to; the name must not be "id", "parent", "expanded", "rowColor", "editable" or "deletable", since these values are used for other functions, see parameters for values
onClick (optional) (default: "") Script which is executed when a field in this column is clicked. It has the same properties as onClick of the Button. The script is only executed if this field is not empty, i.e. 0, false or "" (since IP-Symcon 5.2)
save (optional) (default: true, if the element is editable, otherwise false) If true, the values of this column should be saved as module properties, see Saving and loading trees
visible (optional) (default: true) If false, the column is not displayed
width Width of the column in pixels, as a CSS string (e.g. “100px”); exactly one column must have the value “auto”, which means that the width of that column uses the rest of the available space. In addition, the expansion symbols of the tree are displayed in this column.

Parameters for edit

Parameter Description
type Type of representation, according to the possible entries:
CheckBox, IntervalBox, NumberSpinner, PasswordTextBox, Select, SelectCategory, SelectColor, SelectEvent, SelectFile, SelectInstance, SelectLink, SelectMedia, SelectObject, SelectScript, SelectVariable, ValidationTextBox, List, Tree
Further parameters The other parameters depend on the type selected; the parameters "name" and "caption" of the type are ignored
Warning

If the "type" List or Tree is used, the value of this column is not JSON-coded again. It is only necessary to parse the value of the parent tree once. Each sub-list or subtree is then directly available as an object. Similarly, the values in "values" do not have to be coded twice.

Warning

The "add" parameter of the column is translated according to the localization, provided the "type" of "edit" is ValidationTextBox or PasswordTextBox or "edit" is not set at all

Parameters for sort

Parameter Description
column Name of the column according to which the tree is sorted
direction The direction of the sort; "ascending" for an ascending order and "descending" for a descending order

Parameters for values

Parameter Description
deletable (optional) (default: true) If false, the line cannot be deleted (since IP-Symcon 5.4)
editable (optional) (default: true) If false, the line cannot be edited, even if the tree itself has editable columns (since IP-Symcon 5.4)
expanded (optional) (default: false) If this value is true, the entry is expanded directly when the configuration form is loaded
id An identifier with which the entry in the tree view can be addressed as a parent node, id must be greater than 0
parent (optional) (default: 0) The id of a value can be set in this field, which becomes the parent node of this value in the tree display. For this, the parent value must come before of the child in the array. If "parent" is 0, the element is inserted at the top level.
rowColor (optional) (default: transparent) Background color of the line as hex code (e.g. red: "#ff0000"), empty string for transparency
Further parameters (optional) (default: "") For each initial entry in the tree, the values for all columns are defined here. For this purpose, a parameter with the name of the column is entered for each column. The assignment of the parameter corresponds to the value of this column for the corresponding entry.

Saving and loading trees

The saving and loading of trees is done almost analogously to Lists.

The values for id and parent are also saved in the property.

When loading, it should be noted that when using values, the identifier of the node must always be specified so that these can be assigned to the appropriate node from the property.

Use of the tree content in on-actions

The use of the values of the tress in scripts is analogous to Lists. In addition, each entry contains the value "expanded", which defines whether the entry is expanded (true) or collapsed (false).

Example

{
     "type": "Tree",
     "name": "Devices",
     "caption": "Devices",
     "rowCount": 5,
     "add": true,
     "delete": true,
     "sort": {
         "column": "Name",
         "direction": "ascending"
     },
     "columns": [{
         "caption": "InstanceID",
         "name": "InstanceID", 
         "width": "75px",
         "add": 0,
         "edit": {
             "type": "SelectInstance"
         }
     }, {
         "caption": "Name",
         "name": "Name",
         "width": "auto",
         "add": ""
     }, {
         "caption": "State",
         "name": "State",
         "width": "40px",
         "add": "New!"
     }, {
         "caption": "Temperature",
         "name": "Temperature",
         "width": "75px",
         "add": 20.0,
         "edit": {
             "type": "NumberSpinner",
             "digits": 2
         }
     }],
     "values": [{
             "id": 1,
             "InstanceID": 0,
             "Name": "Category",
             "State": "",
             "Temperature": 0
         },{
             "id": 2,
             "parent": 1,
             "InstanceID": 12435,
             "Name": "ABCD",
             "State": "OK!",
             "Temperature": 23.31,
             "rowColor": "#ff0000"
     }]
 }
Any questions?