Use UI to change a object in a Context object array based on dropdown list UI

This allows the changing of variables in one object of an array of objects (stored in the example in a Context Flow file variable) based on a key in the object. Reading the variables to initiate the Drop down and number UI objects was easy, but writing them back was more difficult but this cracked it.

The example is used to adjust several variables in a thing that controls a Solar hot water system, with each variable having upper and lower limits (also stored in the object).

Just add new objects to the Context array to add new variables to adjust.

[{"id":"ab266f1b.4a31c","type":"catch","z":"d05da15.a8b596","name":"","scope":null,"uncaught":false,"x":110,"y":573,"wires":[["da3e8088.d4077"]]},{"id":"da3e8088.d4077","type":"debug","z":"d05da15.a8b596","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","statusVal":"","statusType":"auto","x":340,"y":573,"wires":[]},{"id":"c80b6306.f7794","type":"link out","z":"d05da15.a8b596","name":"To MQTT Out","links":[],"x":1182.5,"y":395,"wires":[]},{"id":"9d0dc549.726b48","type":"rbe","z":"d05da15.a8b596","name":"","func":"rbei","gap":"","start":"","inout":"out","property":"payload","x":1089.5,"y":395,"wires":[["c80b6306.f7794"]]},{"id":"a387befa.a8e5","type":"group","z":"d05da15.a8b596","name":"Change Shed HW Settings","style":{"label":true},"nodes":["22a9690.feefb96","cd625b5c.06c908","b32855bd.ebd618","5c88f455.6ad7dc","c34a8550.4cb248","4dafae4.7f1525","238d8e4d.084b32","854e9345.85924","59f59a84.e4e434","32534936.6e4066","466dfb76.6e7f74","b8aa97b5.04d4a8","fd7791db.fb8cf","f1e74695.25b908","f4225898.728088","8bca0ccc.e539d","ae10ada2.9e3a","6232d173.c4704"],"x":31,"y":161,"w":995.5,"h":362},{"id":"22a9690.feefb96","type":"inject","z":"d05da15.a8b596","g":"a387befa.a8e5","name":"","repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"","payloadType":"date","x":164,"y":482,"wires":[["32534936.6e4066"]]},{"id":"cd625b5c.06c908","type":"ui_numeric","z":"d05da15.a8b596","g":"a387befa.a8e5","name":"Set Temp","label":"Temperature C","tooltip":"","group":"56dd1777.0149a8","order":2,"width":0,"height":0,"wrap":false,"passthru":false,"topic":"","format":"{{value}}","min":"-10","max":"100","step":1,"x":882,"y":335,"wires":[["59f59a84.e4e434"]]},{"id":"b32855bd.ebd618","type":"ui_ui_control","z":"d05da15.a8b596","g":"a387befa.a8e5","name":"to SHW Settings UI","events":"change","x":301.5,"y":204,"wires":[["f1e74695.25b908"]]},{"id":"5c88f455.6ad7dc","type":"change","z":"d05da15.a8b596","g":"a387befa.a8e5","name":"disable control","rules":[{"t":"set","p":"enabled","pt":"msg","to":"false","tot":"bool"}],"action":"","property":"","from":"","to":"","reg":false,"x":707.5,"y":203,"wires":[["cd625b5c.06c908","238d8e4d.084b32"]]},{"id":"c34a8550.4cb248","type":"change","z":"d05da15.a8b596","g":"a387befa.a8e5","name":"","rules":[{"t":"set","p":"SHW","pt":"msg","to":"#:(file)::SHW","tot":"flow"},{"t":"set","p":"options","pt":"msg","to":"SHW[].key","tot":"jsonata"},{"t":"delete","p":"ParamKey","pt":"flow"}],"action":"","property":"","from":"","to":"","reg":false,"x":310.5,"y":336,"wires":[["4dafae4.7f1525","238d8e4d.084b32"]]},{"id":"4dafae4.7f1525","type":"ui_dropdown","z":"d05da15.a8b596","g":"a387befa.a8e5","name":"","label":"New Drop down","tooltip":"","place":"Select option","group":"56dd1777.0149a8","order":1,"width":0,"height":0,"passthru":false,"multiple":false,"options":[{"label":"","value":"","type":"str"}],"payload":"","topic":"","x":511.5,"y":335,"wires":[["854e9345.85924"]]},{"id":"238d8e4d.084b32","type":"debug","z":"d05da15.a8b596","g":"a387befa.a8e5","name":"","active":false,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","statusVal":"","statusType":"auto","x":930.5,"y":202,"wires":[]},{"id":"854e9345.85924","type":"change","z":"d05da15.a8b596","g":"a387befa.a8e5","name":"","rules":[{"t":"set","p":"SHW","pt":"msg","to":"#:(file)::SHW","tot":"flow"},{"t":"set","p":"ParamKey","pt":"flow","to":"payload","tot":"msg"},{"t":"set","p":"Param","pt":"msg","to":"SHW[key=$$.payload]","tot":"jsonata"},{"t":"set","p":"payload","pt":"msg","to":"Param.current","tot":"msg"},{"t":"set","p":"enabled","pt":"msg","to":"true","tot":"bool"}],"action":"","property":"","from":"","to":"","reg":false,"x":696,"y":335,"wires":[["238d8e4d.084b32","cd625b5c.06c908"]]},{"id":"59f59a84.e4e434","type":"change","z":"d05da15.a8b596","g":"a387befa.a8e5","name":"","rules":[{"t":"set","p":"SHW","pt":"msg","to":"#:(file)::SHW","tot":"flow"},{"t":"set","p":"ParamKey","pt":"msg","to":"ParamKey","tot":"flow"},{"t":"set","p":"Param","pt":"msg","to":"SHW[key=$$.ParamKey]","tot":"jsonata"},{"t":"set","p":"payload","pt":"msg","to":"$min(\t   [\t       $max([$$.Param.min, $$.payload]),\t       $$.Param.max\t   ]\t)","tot":"jsonata"},{"t":"set","p":"Param.current","pt":"msg","to":"payload","tot":"msg"},{"t":"set","p":"#:(file)::SHW","pt":"flow","to":"$map(\t   SHW,\t   function($v, $i){\t       $v.key!=$$.ParamKey?$v:$merge([$v, {\"current\":payload}])\t   }\t)\t","tot":"jsonata"},{"t":"set","p":"topic","pt":"msg","to":"Param.MQTTtopic","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":879.5,"y":396,"wires":[["238d8e4d.084b32","cd625b5c.06c908","9d0dc549.726b48"]]},{"id":"32534936.6e4066","type":"template","z":"d05da15.a8b596","g":"a387befa.a8e5","name":"Shed Hot water control Array","field":"payload","fieldType":"msg","format":"json","syntax":"plain","template":"[{\"key\":\"ShedTankMaxTemp\",\"current\":80,\"max\":100,\"min\":30,\"MQTTtopic\":\"Shed/HotWater/Tank/MaxTemp\"},{\"key\":\"ShedTubeFrostTemp\",\"current\":10,\"max\":25,\"min\":-10,\"MQTTtopic\":\"Shed/HotWater/Tubes/FrostTemp\"},{\"key\":\"ShedTubeOnTempDiff\",\"current\":10,\"max\":25,\"min\":5,\"MQTTtopic\":\"Shed/HotWater/Pump/OnTempDiff\"},{\"key\":\"ShedTubeOffTempDrop\",\"current\":4,\"max\":20,\"min\":1,\"MQTTtopic\":\"Shed/HotWater/Pump/OffTempDrop\"}]","output":"str","x":372.5,"y":482,"wires":[["b8aa97b5.04d4a8"]]},{"id":"466dfb76.6e7f74","type":"debug","z":"d05da15.a8b596","g":"a387befa.a8e5","name":"","active":false,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","statusVal":"","statusType":"auto","x":854.5,"y":480,"wires":[]},{"id":"b8aa97b5.04d4a8","type":"json","z":"d05da15.a8b596","g":"a387befa.a8e5","name":"","property":"payload","action":"","pretty":false,"x":567.5,"y":482,"wires":[["fd7791db.fb8cf"]]},{"id":"fd7791db.fb8cf","type":"change","z":"d05da15.a8b596","g":"a387befa.a8e5","name":"","rules":[{"t":"set","p":"#:(file)::SHW","pt":"flow","to":"payload","tot":"msg"}],"action":"","property":"","from":"","to":"","reg":false,"x":714.5,"y":481,"wires":[["466dfb76.6e7f74"]]},{"id":"f1e74695.25b908","type":"switch","z":"d05da15.a8b596","g":"a387befa.a8e5","name":"","property":"name","propertyType":"msg","rules":[{"t":"eq","v":"Shed Hot Water Settings","vt":"str"}],"checkall":"true","repair":false,"outputs":1,"x":525.5,"y":204,"wires":[["c34a8550.4cb248","5c88f455.6ad7dc"]]},{"id":"f4225898.728088","type":"ui_button","z":"d05da15.a8b596","g":"a387befa.a8e5","name":"","group":"ddb08462.c1f2f8","order":2,"width":"3","height":"1","passthru":false,"label":"Settings","tooltip":"","color":"","bgcolor":"","icon":"fa-wrench","payload":"Shed Hot Water Settings","payloadType":"str","topic":"","x":117,"y":205,"wires":[["b32855bd.ebd618"]]},{"id":"8bca0ccc.e539d","type":"ui_button","z":"d05da15.a8b596","g":"a387befa.a8e5","name":"","group":"56dd1777.0149a8","order":3,"width":"3","height":"1","passthru":false,"label":" Done","tooltip":"","color":"","bgcolor":"","icon":"fa-hand-o-left","payload":"Water","payloadType":"str","topic":"","x":129.5,"y":390,"wires":[["ae10ada2.9e3a"]]},{"id":"ae10ada2.9e3a","type":"ui_ui_control","z":"d05da15.a8b596","g":"a387befa.a8e5","name":"Back to Water UI","events":"all","x":315.5,"y":389,"wires":[[]]},{"id":"6232d173.c4704","type":"comment","z":"d05da15.a8b596","g":"a387befa.a8e5","name":"Initiate Flow Variable","info":"","x":165.5,"y":435,"wires":[]},{"id":"56dd1777.0149a8","type":"ui_group","z":"","name":"Settings","tab":"b0b54239.86619","order":1,"disp":true,"width":"6","collapse":false},{"id":"ddb08462.c1f2f8","type":"ui_group","z":"","name":"Shed","tab":"979abaed.39ad78","order":1,"disp":true,"width":"6","collapse":false},{"id":"b0b54239.86619","type":"ui_tab","z":"","name":"Shed Hot Water Settings","icon":"fa-settings","order":9,"disabled":false,"hidden":true},{"id":"979abaed.39ad78","type":"ui_tab","z":"","name":"Water","icon":"dashboard","order":4,"disabled":false,"hidden":false}]

Flow Info

Created 3 years, 10 months ago
Rating: not yet rated

Owner

Actions

Rate:

Node Types

Core
  • catch (x1)
  • change (x5)
  • comment (x1)
  • debug (x3)
  • inject (x1)
  • json (x1)
  • link out (x1)
  • rbe (x1)
  • switch (x1)
  • template (x1)
Other
  • group (x1)
  • ui_button (x2)
  • ui_dropdown (x1)
  • ui_group (x2)
  • ui_numeric (x1)
  • ui_tab (x2)
  • ui_ui_control (x2)

Tags

  • Context-arrays
  • Dynamic-array-change
  • UI
  • IOT
Copy this flow JSON to your clipboard and then import into Node-RED using the Import From > Clipboard (Ctrl-I) menu option