Dashboard 2.0 ui elements order in subworkflow

Adding multiple ui elements to a subworkflow, they appear in the order they were added. How can the order be changed?

They can't. Yet.

You could temporarily move them to a regular flow, order them, move them back.

Looking forward, if we can't get WYSIWYG editing working for subflows, I am thinking of exposing the order property to the user when the nodes detect themselves to be contained in a subflow.

See the discussion here also:

Follow that to get to a feature request for all of the priority/ordering of dashboard items to be exposed programmatically. Feel free to add to that ticket - I'm not sure if there is a voting system, but I would love to see how many other people would find that useful.

I think that discussion is about dynamically setting the position at run time, rather than at design/deploy time.

There is already an open feature request for specifying widget order within a subflow. Widget ordering in subflows · Issue #1062 · FlowFuse/node-red-dashboard · GitHub

I was able to arrange the elements manually as @Steve-Mcl suggested.
Now the issue is that I have dashboard elements from workflow and elements out of subworkflows. I can't order workflow elements against subworkflow elements. Like adding a text node inbetween subworkflows.
Seems like I'll need to move all dashboard elements out of subworkflows an order them manually.

There is an open issue for this, but it has not received much love recently. You could add a comment to the issue expressing your interest. Unable to position a subflow containing a ui-node on the dashboard · Issue #710 · FlowFuse/node-red-dashboard · GitHub

1 Like

+1 left a comment over there :wink:

I'm currently doing copy paste of the dashboad elements for each subworkflow which is ok. But what is strange and also making it difficult is:

a) Hovering over the dashboard layout item on the right side, does not highlight the element. It requires a push on the focus button. Makes it hard to check the order of the dashboard elements as wanted.

b) Copy and pasting several dashboad items screws up the order of the copied elements and the pasted ones. Some elements get added at the bottom of the list, some of the copied items get replaced by the pasted ones. I can see no strategy behind. I would expect either all pasted elements get at the end of the list as a group or as in dashboard 1 each pasted item below the one it was copied from.
Or maybe I'm just not used to the new way.

I refer to copied elements as the source elements, pasted elements as the copied version.

c) It would help a lot if ui_update as input could be set to any other name. E.g. a function node shall outputs 3 different ui_update parameter sets for 3 buttons. Currently I can store them in msg.A, msg.B, msg.C to have them within one message, afterwards copying Ato ui_update for button 1, B to ui_update for button 2 and so forth. working for sure, but not so nice and efficient.

For c) you could send each msg using node.send() with a different topic for each msg and then use a switch node to direct the msg's to the relevant buttons.

@Buckskin True, but I also need 3 switch nodes. I would like to send one msg (with A,B,C) to 3 buttons and have the button select A, B or C (predefining it in the buttons property upfront).