Hide - show a group element

Hi all,
I am using this code on a button and is working

{
"group": {
"hide": [
"tab_group1"
],
"show": [
"tab_group2"
]
}
}

How can I control show / hide only of one or more elements from a group and not the entire group?
Thank you

You could apply a class to the element then use ui-template to make hidden or visable using css visibility.
A simple example

[{"id":"c6152db61102bae1","type":"ui_text","z":"d1395164b4eec73e","group":"2d4fe667.28f8ba","order":15,"width":0,"height":0,"name":"","label":"text","format":"this 1","layout":"row-spread","className":"my_unique_css1","style":false,"font":"","fontSize":16,"color":"#000000","x":330,"y":6280,"wires":[]},{"id":"91956ae1c259e061","type":"ui_text","z":"d1395164b4eec73e","group":"2d4fe667.28f8ba","order":2,"width":0,"height":0,"name":"","label":"text","format":"this 2","layout":"row-spread","className":"my_unique_css2","style":false,"font":"","fontSize":16,"color":"#000000","x":330,"y":6320,"wires":[]},{"id":"a1ebf87ee3fc6107","type":"ui_template","z":"d1395164b4eec73e","group":"2d4fe667.28f8ba","name":"","order":3,"width":0,"height":0,"format":"<style>\n    .my_unique_css1{\n        visibility: {{msg.payload}};\n    }\n </style>","storeOutMessages":false,"fwdInMessages":false,"resendOnRefresh":true,"templateScope":"local","className":"","x":380,"y":6220,"wires":[[]]},{"id":"8ef4f92e3353c307","type":"ui_button","z":"d1395164b4eec73e","name":"","group":"2d4fe667.28f8ba","order":17,"width":0,"height":0,"passthru":false,"label":"hide","tooltip":"","color":"","bgcolor":"","className":"","icon":"","payload":"hidden","payloadType":"str","topic":"topic","topicType":"msg","x":110,"y":6220,"wires":[["a1ebf87ee3fc6107"]]},{"id":"3028f817b6dada9c","type":"ui_button","z":"d1395164b4eec73e","name":"","group":"2d4fe667.28f8ba","order":3,"width":0,"height":0,"passthru":false,"label":"show","tooltip":"","color":"","bgcolor":"","className":"","icon":"","payload":"visible","payloadType":"str","topic":"topic","topicType":"msg","x":110,"y":6260,"wires":[["a1ebf87ee3fc6107"]]},{"id":"2d4fe667.28f8ba","type":"ui_group","name":"demo","tab":"1caa8458.b17814","order":2,"disp":true,"width":"18","collapse":false,"className":""},{"id":"1caa8458.b17814","type":"ui_tab","name":"Demo","icon":"dashboard","order":2,"disabled":false,"hidden":false}]
1 Like