Dynamic tables are tables that are populated dynamically as your data arrive while keeping the history of the previous data in each row.
Make sure that the data you want to display in the table is grouped using a serie number, otherwise the values will appear each one in its own rows, with all the other cells left in blank.
Each variable you selected will become a column and the rows will contain the values, from the most recent to the oldest data.
By default the column title will be the variable name, but you can change it by adding a label to your variables.
To temporarily order columns just click on the label of the column, clicking again will toggle the order in descend and ascend mode.
Under parameter configuration you will find some specific options:
- Maximum number of rows: if the time span isn’t enough, you can also filter the exact amount of data that will appear in your table using this option.
- Only display rows with all values: this option guarantees that only rows with values in all of its cells will be displayed.
- Display date and time: if you check this options, a column named “Time” will be added to the table and will show the
timeof one of the values of that row. This “Time” comes from the original JSON field time stamp.
- Add filter field: If set to Yes, a filter field will be displayed at the top of the dynamic table. This field allows users to search for characters or words in the whole table, displaying the filtered results.
- Allow User to delete rows: if you check this option, the dynamic table will render a column with a Trash icon on each row. By clicking on this icon, all data on that row will be deleted from the data bucket.
- Analysis to run when user delete rows: You can select a Script to will run when the user click on the ‘Trash’ icon. All data that was deleted will be sent to the selected Analysis as the scope parameter.
Dynamic table offers the possibility of using icons to represent your data. To use, select your variables and then head over to the Visualization tab, and then go to Data visualization, which will look like this:
By default, the data visualization shows the variable value. But, by using the Show Icon option, you can define custom rules to display icons in your table.
Following the configuration above your table will look something like this:
Editing values inside of the table
You can allow users to modify variable's value inside of a table by enabling the edit option located inside the widget's configuration.
Additional options available:
- Allow user to edit field?, indicates whether user can edit or not, this field in the table.
- The Field Type option indicated what kind of value will be able to be submitted in the input once the user modifies it.
- The Is it a required field? option indicates if the field can be left empty or not when it is modified. If it is marked as yes, the field will be obligatory.
- The Field placeholder option shows a placeholder in the input when the data in the variable is empty.
Once you mark this field as editable, you can modify all the editable values of a row by pressing the pencil icon of the respective row in the right side of the table.
Only the fields that were marked as editable will be able to be modified.
To save the changes, press the save icon that will subsequently appear.
These are the types of fields available for a variable when we modify it.
- Text (default)
A Field with the type text accepts any kind of input.
If the field type is Number, only numbers will be accepted in the input that will appear once we modify the row.
The dropdown field shows suggestions of values once the focus in on the field. Upon selecting this option, new options will appear for you to customize your dropdown.
The first option in the top left corner is called Enable Label Option, this options allows labels to be displayed instead of the actual values of the options. if you set this field as yes, everytime the variable's value matches one of the values in the options, the text inside the variable will be changed to the respective label.
In this example, we are saying that everytime we select the option Car in the dropdown, automatically that variable will be set to the value "static_1".
By selecting the option Car, the variable will have a value of "static_1". If the option Bike is chosen, the variable will have a value of "static_2", just like it was set in the options.
The second field in the dropdown's configuration is the type of the dropdown. A dropdown can be either Static or Dynamic.
Static dropdowns are the ones that contain a static amount of suggestions that are put manually in the field's configuration.
Dynamic dropdowns are the ones that contain an infinite amount of suggestions, the suggestions are acquired from the variables of your system.
In the dropdown above, we have set the suggestions to dynamic, and to get the values from the variable my_variable from the Bucket My Bucket.
If we enter in edit mode and focus the input, the options of the dropdown will be shown in accordance with the values of the variable my_variable.
In dynamic dropdowns, an optional label field can be sent via devices in the metadata object to set the label of the variable shown. The same principles apply here, meaning if a label was sent via device and the value matches a value being displayed, the text will show the label, and not the value.