### Author:  [@Christian-Me](https://discourse.nodered.org/u/Christian-Me)
#### Post date: [7 June 2020 22:01 UTC](https://discourse.nodered.org/t/examples-for-node-red-node-ui-table/14256/81 "2020-06-07T22:01:23Z")
Yes ... isn't too difficult. You need a callback function to send the edited data back to Node-RED. Best is to define one for the hole table independent of the type of editor defined for the column:
`msg.ui_control.tabulator.cellEdited`.
```auto
function(cell){
this.send({
ui_control:{callback:'cellEdited'},
payload:cell.getValue(),
oldValue:cell.getOldValue(),
field:cell.getColumn().getField(),
id:cell.getRow().getCell('id').getValue()
});
}
```
Then you only have to define the editor type for every column you want to have the edit feature enabled like `msg.ui_control.tabulator.colums[{field:'yourColum',editor:'input'}]`
If you need some kind on validation you perhaps write individual `cellEdited` functions for each column.
ui-table node will send a message for every edited field containing the row (id or any other index), the column (field), new and old value.
---
### Author:  [@deme](https://discourse.nodered.org/u/deme)
#### Post date: [8 June 2020 08:12 UTC](https://discourse.nodered.org/t/examples-for-node-red-node-ui-table/14256/82 "2020-06-08T08:12:40Z")
that sounds exactly like what I'm looking for! By any chance, do you have this as a sample flow? I have not yet worked with the tabulator feature and am not 100% sure where to integrate this.
Thanks!
---
### Author:  [@deme](https://discourse.nodered.org/u/deme)
#### Post date: [9 June 2020 21:25 UTC](https://discourse.nodered.org/t/examples-for-node-red-node-ui-table/14256/83 "2020-06-09T21:25:36Z")
Thanks again for your hint, I managed to adapt one of the supplied examples:
now you can click into the column "ROom" and change the text. The change is then emitted on the output-port of the table.
```auto
[{"id":"c4f39e9c.3642f8","type":"tab","label":"Flow 2","disabled":false,"info":""},{"id":"455415d1.6b50b4","type":"inject","z":"c4f39e9c.3642f8","name":"","topic":"","payload":"","payloadType":"str","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":440,"y":320,"wires":[["dd154dab.fcd418"]]},{"id":"59a0cfff.9bcb","type":"debug","z":"c4f39e9c.3642f8","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","x":910,"y":320,"wires":[]},{"id":"4c5c306f.e02298","type":"ui_table","z":"c4f39e9c.3642f8","group":"b070d416.db371","name":"Thermostats","order":1,"width":"14","height":"7","columns":[],"outputs":1,"cts":true,"x":750,"y":320,"wires":[["59a0cfff.9bcb"]]},{"id":"dd154dab.fcd418","type":"function","z":"c4f39e9c.3642f8","name":"","func":"msg.payload = [\n {\"name\":\"MEQ0451495\",\"room\":\"Bathroom\",\"SET_TEMPERATURE-value\":22,\"ACTUAL_TEMPERATURE-value\":21.8,\"VALVE_STATE-value\":90,\"BATTERY_STATE-value\":2.7,\"BOOST_STATE-value\":0,\"AUTO_MODE-value\":true,\"CONTROL_MODE-value\":0},\n {\"name\":\"MEQ1875547\",\"room\":\"Living Room\",\"SET_TEMPERATURE-value\":12,\"ACTUAL_TEMPERATURE-value\":16.2,\"VALVE_STATE-value\":0,\"BATTERY_STATE-value\":2.7,\"BOOST_STATE-value\":0,\"AUTO_MODE-value\":false,\"CONTROL_MODE-value\":1},\n {\"name\":\"MEQ1875538\",\"room\":\"Living Room\",\"SET_TEMPERATURE-value\":18,\"ACTUAL_TEMPERATURE-value\":19.5,\"VALVE_STATE-value\":0,\"BATTERY_STATE-value\":2.6,\"BOOST_STATE-value\":0,\"AUTO_MODE-value\":false,\"CONTROL_MODE-value\":2},\n {\"name\":\"MEQ0447462\",\"room\":\"Kitchen\",\"SET_TEMPERATURE-value\":17,\"ACTUAL_TEMPERATURE-value\":22.2,\"VALVE_STATE-value\":0,\"BATTERY_STATE-value\":2.7,\"BOOST_STATE-value\":10,\"AUTO_MODE-value\":false,\"CONTROL_MODE-value\":3},\n {\"name\":\"MEQ1875551\",\"room\":\"Office\",\"SET_TEMPERATURE-value\":18,\"ACTUAL_TEMPERATURE-value\":20.2,\"VALVE_STATE-value\":0,\"BATTERY_STATE-value\":2.7,\"BOOST_STATE-value\":0,\"AUTO_MODE-value\":false,\"CONTROL_MODE-value\":0},\n {\"name\":\"MEQ0447425\",\"room\":\"Dining Room\",\"SET_TEMPERATURE-value\":19,\"ACTUAL_TEMPERATURE-value\":20.4,\"VALVE_STATE-value\":0,\"BATTERY_STATE-value\":2.7,\"BOOST_STATE-value\":0,\"AUTO_MODE-value\":false,\"CONTROL_MODE-value\":0},\n {\"name\":\"MEQ1875546\",\"room\":\"Dining Room\",\"SET_TEMPERATURE-value\":20,\"ACTUAL_TEMPERATURE-value\":18.8,\"VALVE_STATE-value\":99,\"BATTERY_STATE-value\":2.7,\"BOOST_STATE-value\":0,\"AUTO_MODE-value\":false,\"CONTROL_MODE-value\":0},\n {\"name\":\"MEQ0447483\",\"room\":\"Bedroom\",\"SET_TEMPERATURE-value\":17,\"ACTUAL_TEMPERATURE-value\":22.4,\"VALVE_STATE-value\":0,\"BATTERY_STATE-value\":2.7,\"BOOST_STATE-value\":0,\"AUTO_MODE-value\":false,\"CONTROL_MODE-value\":0},\n {\"name\":\"MEQ1875541\",\"room\":\"Child\",\"SET_TEMPERATURE-value\":18,\"ACTUAL_TEMPERATURE-value\":20.4,\"VALVE_STATE-value\":0,\"BATTERY_STATE-value\":2.7,\"BOOST_STATE-value\":0,\"AUTO_MODE-value\":false,\"CONTROL_MODE-value\":0},\n {\"name\":\"MEQ1875552\",\"room\":\"Guest Room\",\"SET_TEMPERATURE-value\":20,\"ACTUAL_TEMPERATURE-value\":21.1,\"VALVE_STATE-value\":9,\"BATTERY_STATE-value\":2.8,\"BOOST_STATE-value\":0,\"AUTO_MODE-value\":false,\"CONTROL_MODE-value\":0}\n]\n\nmsg.ui_control = {\n \"tabulator\":{\n \"columnResized\":\"function(column){var newColumn = { field: column._column.field, visible: column._column.visible, width: column._column.width, widthFixed: column._column.widthFixed, widthStyled: column._column.widthStyled }; this.send({topic:this.config.topic,ui_control:{callback:'columnResized',columnWidths:newColumn}}); }\",\n \"columnMoved\":\"function(column, columns){ var newColumns=[]; columns.forEach(function (column) { newColumns.push({'field': column._column.field}); }); this.send({topic:this.config.topic,ui_control:{callback:'columnMoved',columns:newColumns}}); }\",\n \"groupHeader\":\"function (value, count, data, group) {return value + \\\"
### Author:  [@Christian-Me](https://discourse.nodered.org/u/Christian-Me)
#### Post date: [10 June 2020 14:28 UTC](https://discourse.nodered.org/t/examples-for-node-red-node-ui-table/14256/84 "2020-06-10T14:28:32Z")
Great you found your own solution and my typo 🤪
---
### Author:  [@deme](https://discourse.nodered.org/u/deme)
#### Post date: [17 June 2020 21:59 UTC](https://discourse.nodered.org/t/examples-for-node-red-node-ui-table/14256/85 "2020-06-17T21:59:20Z")
Another issue I came across: according to the tabulator doc's, it should be possible to change the color of a row depending on some column's value:
```auto
msg.payload = [{"time": 1, "value":true}, {"time":2, "value": false}, {"time":3, "value": true}];
columns = [
{
title:"Time",
field:"time",
width:190,
align:"left",
headerSortStartingDir:"desc"
},
{
title:"Status",
field:"value",
width:250,
align:"center",
headerSort:false
}]
msg.ui_control = {};
msg.ui_control.tabulator = {
"placeholder":"empty",
"columns":columns,
"pagination":"local",
"paginationSize":20,
"initialSort":[
{column:"timestamp", dir:"desc"}
],
"rowFormatter":function(row){
var data = row.getData();
if(data.value === true){
row.getElement().style.backgroundColor = "#A6A6DF";
row.getElement().style.color= "#FF0000";
}
}
}
```
Unfortunately, this does not work for me - anyone who got this to work?
---
### Author:  [@Christian-Me](https://discourse.nodered.org/u/Christian-Me)
#### Post date: [17 June 2020 23:18 UTC](https://discourse.nodered.org/t/examples-for-node-red-node-ui-table/14256/86 "2020-06-17T23:18:58Z")
Yes ... I use this function in my "remote device table"
to indicate the state of my remote devices.
```auto
{
"tabulator": {
"rowFormatter": "function(row){ var data = row.getData(); switch (data.$state) { case \"lost\": row.getElement().style.backgroundColor = \"#9e2e66\"; row.getElement().style.color = \"#a6a6a6\"; break; case \"sleeping\": row.getElement().style.backgroundColor = \"#336699\"; break; case \"disconnected\": row.getElement().style.backgroundColor = \"#cc3300\"; row.getElement().style.color = \"#a6a6a6\"; break; case \"alert\": row.getElement().style.backgroundColor = \"#A6A6DF\"; break; case \"init\": row.getElement().style.backgroundColor = \"#f2f20d\"; break; case \"ready\": row.getElement().style.backgroundColor = \"\"; row.getElement().style.color = \"\"; break; } }",
}
}
```
```auto
rowFormatter = function(row){
var data = row.getData();
switch (data.$state) {
case "lost":
row.getElement().style.backgroundColor = "#9e2e66";
row.getElement().style.color = "#a6a6a6";
break;
case "sleeping":
row.getElement().style.backgroundColor = "#336699";
break;
case "disconnected":
row.getElement().style.backgroundColor = "#cc3300";
row.getElement().style.color = "#a6a6a6";
break;
case "alert":
row.getElement().style.backgroundColor = "#A6A6DF";
break;
case "init":
row.getElement().style.backgroundColor = "#f2f20d";
break;
case "ready":
row.getElement().style.backgroundColor = "";
row.getElement().style.color = "";
break;
}
}
```
It could be that your boolean values are not stored as boolean type. I would insert a `debugger` statement behind the row.getData() call and check what value and type `data.value` actually is. _(I love the "beauty" of javascript)_
---
### Author:  [@met98](https://discourse.nodered.org/u/met98)
#### Post date: [21 June 2020 21:32 UTC](https://discourse.nodered.org/t/examples-for-node-red-node-ui-table/14256/87 "2020-06-21T21:32:04Z")
Hi
Is it possible to add a text field to search for lines containing the searched word? is it possible to see an example?
---
### Author:  [@Christian-Me](https://discourse.nodered.org/u/Christian-Me)
#### Post date: [21 June 2020 23:20 UTC](https://discourse.nodered.org/t/examples-for-node-red-node-ui-table/14256/88 "2020-06-21T23:20:42Z")
Yes it is possible by using filters. Easiest are header filters:
> **[Tabulator - Filtering Data](https://tabulator.info/docs/4.0/filter#header)**
>
> Use custom or built in filter fuctions to allow users to view a subset of table data
This is used in the syslog table:
> [@A Syslog Server for the Dashboard](https://discourse.nodered.org/t/a-syslog-server-for-the-dashboard/24337):
>
> Hi perhaps somebody is interested. Just finished a syslog server for the node-red dashboard. It makes use of ui-table. I hope somebody finds it useful. It is build around ui-table and a subflow I use for all kinds of tables in my projects. [https://raw.githubusercontent.com/Christian-Me/node-red-contrib-home/master/Node-RED/syslog/screenshots/demo.gif(image larger than 4096KB)](https://raw.githubusercontent.com/Christian-Me/node-red-contrib-home/master/Node-RED/syslog/screenshots/demo.gif) Features can handle quite huge amounts of data only limited by the clients browser. As every line is sent individual…
A little bit complex but you should find the relevant parameters in the tabulator json.
But you can theoretically control filters by sending commands and using dashboard input widget or other sources.
---
### Author:  [@Christian-Me](https://discourse.nodered.org/u/Christian-Me)
#### Post date: [23 June 2020 21:11 UTC](https://discourse.nodered.org/t/examples-for-node-red-node-ui-table/14256/90 "2020-06-23T21:11:54Z")
Hi,
I looked into your flow.
First, I need some demo data. Please put a debug node behind your csv node and copy the data from the debug tab. Put this data as a json into a inject node.
Second in which column are you searching for your input data? Like Excel you can only filter in columns individually. (a "full text" search is not available in tabulator out of the box (as far as I know))
Third, please take a look into the ui\_control example to define your table by using ui\_control messages. [This will give you the ability to use the header filters.](http://tabulator.info/examples/4.7?#filter-header)
Here you find an example to inject demo data too.
---
### Author:  [@met98](https://discourse.nodered.org/u/met98)
#### Post date: [25 June 2020 21:10 UTC](https://discourse.nodered.org/t/examples-for-node-red-node-ui-table/14256/91 "2020-06-25T21:10:48Z")
Thank you
---
### Author:  [@bioshock2k](https://discourse.nodered.org/u/bioshock2k)
#### Post date: [29 June 2020 13:27 UTC](https://discourse.nodered.org/t/examples-for-node-red-node-ui-table/14256/92 "2020-06-29T13:27:47Z")
Hey everyone!
I am loving this dashboard discussioon because i can see the potencial on what it can implement.
I am a newbie on data parsing and i am working on a 200 variables json.
IDK where to start on organizing all that data. Every implementation seems very manual on the deciding the colums etc.
Is there any more automatic way off doing the organization?
Best regards!
---
### Author:  [@Christian-Me](https://discourse.nodered.org/u/Christian-Me)
#### Post date: [30 June 2020 06:26 UTC](https://discourse.nodered.org/t/examples-for-node-red-node-ui-table/14256/93 "2020-06-30T06:26:45Z")
Hi, welcome.
By using msg.ui\_control you can define your table entirely by sending the configuration dynamically (and even modifying it). See documentation of ui-table and tabulator for more Information.
[https://discourse.nodered.org/t/ui-table-supports-ui-control](https://discourse.nodered.org/t/ui-table-supports-ui-control)
---
### Author:  [@bioshock2k](https://discourse.nodered.org/u/bioshock2k)
#### Post date: [3 July 2020 10:47 UTC](https://discourse.nodered.org/t/examples-for-node-red-node-ui-table/14256/94 "2020-07-03T10:47:34Z")
I will take a look into it thanks!
---
### Author:  [@system](https://discourse.nodered.org/u/system)
#### Post date: [17 July 2020 10:47 UTC](https://discourse.nodered.org/t/examples-for-node-red-node-ui-table/14256/95 "2020-07-17T10:47:36Z")
This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.
[Previous page](https://discourse.nodered.org/t/examples-for-node-red-node-ui-table/14256.md?page=4)