Dashboard dropdown node can I reset to 'select option' after selection

I need to reset some of my dashboard dropdown nodes after selection of a value to 'select option'. So I would like to be able to select an option from the dropdown, that then normally stays as the last selection on the dashboard. But I would like that to be back to no selection, if thats possible

If you send a blank payload it will deselect the option, if you then click outside the dropdown select option will reappear.

If you want select option to show without removing focus from the dropdown something like this should work.

[{"id":"984497c93f75afa4","type":"inject","z":"edbf92277c2a065b","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"Select option","payloadType":"str","x":130,"y":80,"wires":[["8ac70d9e22937441"]]},{"id":"8ac70d9e22937441","type":"ui_dropdown","z":"edbf92277c2a065b","name":"","label":"","tooltip":"","place":"Select option","group":"2d4fe667.28f8ba","order":17,"width":0,"height":0,"passthru":false,"multiple":false,"options":[{"label":"Select option","value":"Select option","type":"str"},{"label":"1","value":1,"type":"num"},{"label":"2","value":2,"type":"num"}],"payload":"","topic":"topic","topicType":"msg","className":"","x":380,"y":80,"wires":[["957a2c2cb8b43298","a4b1838a606cbe1d"]]},{"id":"957a2c2cb8b43298","type":"change","z":"edbf92277c2a065b","name":"","rules":[{"t":"set","p":"payload","pt":"msg","to":"Select option","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":340,"y":140,"wires":[["8ac70d9e22937441"]]},{"id":"a4b1838a606cbe1d","type":"switch","z":"edbf92277c2a065b","name":"","property":"payload","propertyType":"msg","rules":[{"t":"neq","v":"Select option","vt":"str"}],"checkall":"true","repair":false,"outputs":1,"x":530,"y":80,"wires":[["b04a3be90420c7e0"]]},{"id":"b04a3be90420c7e0","type":"debug","z":"edbf92277c2a065b","name":"debug 113","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","statusVal":"","statusType":"auto","x":710,"y":80,"wires":[]},{"id":"2d4fe667.28f8ba","type":"ui_group","name":"demo","tab":"1caa8458.b17814","order":2,"disp":true,"width":"12","collapse":false},{"id":"1caa8458.b17814","type":"ui_tab","name":"Demo","icon":"dashboard","order":1,"disabled":false,"hidden":false}]

Although it works, I cannot use this version. I have colours set for the 'select option' when nothing is selected. If I use your version, the select option is displayed in white, as it is one of the options (of the dropdown). I have not worked out how to set the colour on that. I looked at the display with the chrome inspect but couldnt work out what it is
I set the colour for nothing selected with this in my style template

.nr-dashboard-theme md-select .md-select-placeholder {
    color: slateblue !important;
    background-color: var(--color-yellow) !important;
    }

This is what it looks like, with your one top (Test)

image

You could try putting the dropdown/s in a separate group, when a selection is made send an empty payload back to dropdown, then use ui-control to hide and show the group to force Select option to reappear.
e.g.

[{"id":"f3cbebb2c63b5198","type":"inject","z":"edbf92277c2a065b","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"Select option","payloadType":"str","x":130,"y":60,"wires":[["16dcdc583bdd86da"]]},{"id":"16dcdc583bdd86da","type":"ui_dropdown","z":"edbf92277c2a065b","name":"","label":"","tooltip":"","place":"Select option","group":"2780c2b1c46399ed","order":1,"width":0,"height":0,"passthru":false,"multiple":false,"options":[{"label":"1","value":"1","type":"str"},{"label":"2","value":"2","type":"str"}],"payload":"","topic":"topic","topicType":"msg","className":"","x":320,"y":60,"wires":[["1d1bfe9103f59b65","b82c888c014cbc98"]]},{"id":"1d1bfe9103f59b65","type":"change","z":"edbf92277c2a065b","name":"","rules":[{"t":"set","p":"payload","pt":"msg","to":"","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":300,"y":140,"wires":[["16dcdc583bdd86da","416ef67ae57b2fe6"]]},{"id":"b82c888c014cbc98","type":"debug","z":"edbf92277c2a065b","name":"debug 113","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","statusVal":"","statusType":"auto","x":710,"y":80,"wires":[]},{"id":"416ef67ae57b2fe6","type":"trigger","z":"edbf92277c2a065b","name":"","op1":"{\"group\":{\"hide\":[\"Demo_two\"],\"focus\":true}}","op2":"{\"group\":{\"show\":[\"Demo_two\"],\"focus\":true}}","op1type":"json","op2type":"json","duration":"50","extend":false,"overrideDelay":false,"units":"ms","reset":"","bytopic":"all","topic":"topic","outputs":1,"x":510,"y":140,"wires":[["18093362ceba71ef"]]},{"id":"18093362ceba71ef","type":"ui_ui_control","z":"edbf92277c2a065b","name":"","events":"all","x":680,"y":140,"wires":[[]]},{"id":"2780c2b1c46399ed","type":"ui_group","name":"two","tab":"1caa8458.b17814","order":2,"disp":false,"width":"12","collapse":false,"className":""},{"id":"1caa8458.b17814","type":"ui_tab","name":"Demo","icon":"dashboard","order":1,"disabled":false,"hidden":false}]

That looks ok after deploy.

image

After selecting something, its blank. But, when I tried to screenshot it, its back ! So after selecting, it is blank. If I click my screen anywhere, the select option appears again ! So I cannot screenshot it as its then back to what it should be... :joy:

Add a delay before the change node to allow showing for x delay then it resets to select option.

Its showing the select option for a few tenth of a second, then blank again until I click the screen

Two different dropdowns.
After I click 1


3 seconds after clicking 1

after some time it is still there not clicking anywhere.

Seems to work for me with this example

[{"id":"f3cbebb2c63b5198","type":"inject","z":"edbf92277c2a065b","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"Select option","payloadType":"str","x":130,"y":60,"wires":[["16dcdc583bdd86da"]]},{"id":"16dcdc583bdd86da","type":"ui_dropdown","z":"edbf92277c2a065b","name":"","label":"","tooltip":"","place":"Select option","group":"2780c2b1c46399ed","order":1,"width":0,"height":0,"passthru":false,"multiple":false,"options":[{"label":"1","value":"1","type":"str"},{"label":"2","value":"2","type":"str"}],"payload":"","topic":"topic","topicType":"msg","className":"","x":320,"y":60,"wires":[["b82c888c014cbc98","f498483e56345458"]]},{"id":"1d1bfe9103f59b65","type":"change","z":"edbf92277c2a065b","name":"","rules":[{"t":"set","p":"payload","pt":"msg","to":"","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":320,"y":140,"wires":[["416ef67ae57b2fe6","16dcdc583bdd86da"]]},{"id":"b82c888c014cbc98","type":"debug","z":"edbf92277c2a065b","name":"debug 113","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","statusVal":"","statusType":"auto","x":710,"y":80,"wires":[]},{"id":"f498483e56345458","type":"delay","z":"edbf92277c2a065b","name":"","pauseType":"delay","timeout":"3","timeoutUnits":"seconds","rate":"1","nbRateUnits":"1","rateUnits":"second","randomFirst":"1","randomLast":"5","randomUnits":"seconds","drop":false,"allowrate":false,"outputs":1,"x":140,"y":140,"wires":[["1d1bfe9103f59b65"]]},{"id":"416ef67ae57b2fe6","type":"trigger","z":"edbf92277c2a065b","name":"","op1":"{\"group\":{\"hide\":[\"Demo_two\"],\"focus\":true}}","op2":"{\"group\":{\"show\":[\"Demo_two\"],\"focus\":true}}","op1type":"json","op2type":"json","duration":"50","extend":false,"overrideDelay":false,"units":"ms","reset":"","bytopic":"all","topic":"topic","outputs":1,"x":510,"y":140,"wires":[["18093362ceba71ef"]]},{"id":"18093362ceba71ef","type":"ui_ui_control","z":"edbf92277c2a065b","name":"","events":"all","x":680,"y":140,"wires":[[]]},{"id":"4ab6d2e4d477297f","type":"ui_dropdown","z":"edbf92277c2a065b","name":"","label":"","tooltip":"","place":"Select option","group":"2d4fe667.28f8ba","order":17,"width":0,"height":0,"passthru":true,"multiple":false,"options":[{"label":"s","value":"s","type":"str"}],"payload":"","topic":"topic","topicType":"msg","className":"","x":320,"y":20,"wires":[[]]},{"id":"2780c2b1c46399ed","type":"ui_group","name":"two","tab":"1caa8458.b17814","order":2,"disp":false,"width":"12","collapse":false,"className":""},{"id":"2d4fe667.28f8ba","type":"ui_group","name":"demo","tab":"1caa8458.b17814","order":2,"disp":true,"width":"12","collapse":false},{"id":"1caa8458.b17814","type":"ui_tab","name":"Demo","icon":"dashboard","order":1,"disabled":false,"hidden":false}]

If not working for you, I have no more ideas.

I still have to click somewhere on the screen. Never mind, I think I have to live with it, I just click on the screen somewhere and its how I want it to be. No need to waste any more of your time. I'll come back to that issue when I start working with ui nodes, but more important for me to learn more about function nodes first. Still have a few unresolved questions I will post in a new thread as unrelated to this

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.