Hello.
I try to implement a dropdown menu into my table.
I read a lot about, that it is the hardest, but best way to create good dashbaords with the tabulator.
But i am asking myselft how to integrate a simple dropdownmenu into a column of my table.
I found some examples but did not understand it.
[
{
"id": "ae5cb6b80243bb5e",
"type": "mqtt in",
"z": "bb1e74244b8354b7",
"name": "CIM500/PUMPSTATE",
"topic": "CIM500/PUMPSTATE",
"qos": "2",
"datatype": "auto-detect",
"broker": "10e78a89.5b4fd5",
"nl": false,
"rap": false,
"inputs": 0,
"x": 200,
"y": 140,
"wires": [
[
"e4ee73b10b29030c",
"5f9b993999ef24ac"
]
]
},
{
"id": "e4ee73b10b29030c",
"type": "debug",
"z": "bb1e74244b8354b7",
"name": "debug 4",
"active": false,
"tosidebar": true,
"console": false,
"tostatus": false,
"complete": "payload",
"targetType": "msg",
"statusVal": "",
"statusType": "auto",
"x": 340,
"y": 220,
"wires": []
},
{
"id": "5f9b993999ef24ac",
"type": "function",
"z": "bb1e74244b8354b7",
"name": "Key/Value for table",
"func": "msg.payload= [\n {\n \"ActRemoteAccess\": msg.payload.ActRemoteAccess,\n \"ActDeaerating\": msg.payload.ActDeaerating,\n \"AnalogueMode\": msg.payload.AnalogueMode,\n \"ActTimerMode\": msg.payload.ActTimerMode,\n \"ActSlowMode\": msg.payload.ActSlowMode,\n \"ActVelocity\": msg.payload.ActVelocity,\n \"AutoDeaeratingEnable\": msg.payload.AutoDeaeratingEnable,\n \"FlowControlEnable\": msg.payload.FlowControlEnable,\n \"ModbusWatchdogEnable\": msg.payload.ModbusWatchdogEnable,\n \"PulseMemoryEnable\": msg.payload.PulseMemoryEnable\n\n }\n];\nreturn msg;",
"outputs": 1,
"noerr": 0,
"initialize": "",
"finalize": "",
"libs": [],
"x": 630,
"y": 140,
"wires": [
[
"5e8123e91c967e3c",
"df124d3bf56a0708"
]
]
},
{
"id": "5e8123e91c967e3c",
"type": "debug",
"z": "bb1e74244b8354b7",
"name": "debug 5",
"active": false,
"tosidebar": true,
"console": false,
"tostatus": false,
"complete": "payload",
"targetType": "msg",
"statusVal": "",
"statusType": "auto",
"x": 540,
"y": 220,
"wires": []
},
{
"id": "df124d3bf56a0708",
"type": "ui_table",
"z": "bb1e74244b8354b7",
"group": "5879d49495918d3d",
"name": "table",
"order": 2,
"width": "0",
"height": "0",
"columns": [],
"outputs": 0,
"cts": false,
"x": 930,
"y": 160,
"wires": []
},
{
"id": "18c8ccde42af7f48",
"type": "mqtt in",
"z": "bb1e74244b8354b7",
"name": "CIM500/MC",
"topic": "CIM500/PUMPSTATE",
"qos": "2",
"datatype": "auto-detect",
"broker": "10e78a89.5b4fd5",
"nl": false,
"rap": false,
"inputs": 0,
"x": 230,
"y": 400,
"wires": [
[
"e63ade12e20194f7",
"8b417611e0370798"
]
]
},
{
"id": "e63ade12e20194f7",
"type": "debug",
"z": "bb1e74244b8354b7",
"name": "debug 10",
"active": false,
"tosidebar": true,
"console": false,
"tostatus": false,
"complete": "payload",
"targetType": "msg",
"statusVal": "",
"statusType": "auto",
"x": 400,
"y": 480,
"wires": []
},
{
"id": "8b417611e0370798",
"type": "function",
"z": "bb1e74244b8354b7",
"name": "Key/Value for table",
"func": "msg.payload= [\n {\n \"ActRemoteAccess\": msg.payload.ActRemoteAccess,\n \"ActDeaerating\": msg.payload.ActDeaerating,\n \"AnalogueMode\": msg.payload.AnalogueMode,\n \"ActTimerMode\": msg.payload.ActTimerMode,\n \"ActSlowMode\": msg.payload.ActSlowMode,\n \"ActVelocity\": msg.payload.ActVelocity,\n \"AutoDeaeratingEnable\": msg.payload.AutoDeaeratingEnable,\n \"FlowControlEnable\": msg.payload.FlowControlEnable,\n \"ModbusWatchdogEnable\": msg.payload.ModbusWatchdogEnable,\n \"PulseMemoryEnable\": msg.payload.PulseMemoryEnable\n }\n];\nreturn msg;",
"outputs": 1,
"noerr": 0,
"initialize": "",
"finalize": "",
"libs": [],
"x": 490,
"y": 400,
"wires": [
[
"8dd5148e7b5ec706",
"7d927ddad188402f"
]
]
},
{
"id": "8dd5148e7b5ec706",
"type": "debug",
"z": "bb1e74244b8354b7",
"name": "debug 11",
"active": false,
"tosidebar": true,
"console": false,
"tostatus": false,
"complete": "payload",
"targetType": "msg",
"statusVal": "",
"statusType": "auto",
"x": 600,
"y": 480,
"wires": []
},
{
"id": "7d927ddad188402f",
"type": "ui_table",
"z": "bb1e74244b8354b7",
"group": "9c78b0d6721c4919",
"name": "table",
"order": 2,
"width": "0",
"height": "0",
"columns": [],
"outputs": 0,
"cts": false,
"x": 750,
"y": 400,
"wires": []
},
{
"id": "a9d152953783c030",
"type": "ui_dropdown",
"z": "bb1e74244b8354b7",
"name": "",
"label": "testdropdown",
"tooltip": "",
"place": "Select option",
"group": "5879d49495918d3d",
"order": 2,
"width": 0,
"height": 0,
"passthru": true,
"multiple": false,
"options": [
{
"label": "an",
"value": true,
"type": "bool"
},
{
"label": "aus",
"value": false,
"type": "bool"
}
],
"payload": "",
"topic": "topic",
"topicType": "msg",
"className": "",
"x": 820,
"y": 60,
"wires": [
[]
]
},
{
"id": "10e78a89.5b4fd5",
"type": "mqtt-broker",
"name": "",
"broker": "185.164.7.227",
"port": "1883",
"clientid": "",
"autoConnect": true,
"usetls": false,
"protocolVersion": "4",
"keepalive": "60",
"cleansession": true,
"birthTopic": "",
"birthQos": "0",
"birthPayload": "",
"birthMsg": {},
"closeTopic": "",
"closeQos": "0",
"closePayload": "",
"closeMsg": {},
"willTopic": "",
"willQos": "0",
"willPayload": "",
"willMsg": {},
"userProps": "",
"sessionExpiry": ""
},
{
"id": "5879d49495918d3d",
"type": "ui_group",
"name": "Read",
"tab": "a42d8adbe9caeb3d",
"order": 1,
"disp": false,
"width": "23",
"collapse": false,
"className": ""
},
{
"id": "9c78b0d6721c4919",
"type": "ui_group",
"name": "Read",
"tab": "5f18e4bc12449bfc",
"order": 1,
"disp": true,
"width": "21",
"collapse": false,
"className": ""
},
{
"id": "a42d8adbe9caeb3d",
"type": "ui_tab",
"name": "Pumpe_01",
"icon": "dashboard",
"order": 1,
"disabled": false,
"hidden": false
},
{
"id": "5f18e4bc12449bfc",
"type": "ui_tab",
"name": "Pumpe_02",
"icon": "dashboard",
"order": 2,
"disabled": false,
"hidden": false
}
]
I created to tables in two tabs. I assume i must integrate the dropdownmenu somehow into my functionblock, where i assigne the column. thats where i exit right now.
thank you.