Dragable elements in dashboard

I want to create a dashboard that contains two tables. The first table will contain data from an array.

I would like to be able to drag one or more table elements to another table and get the values as a payload in node red.

Does anyone have any idea how to achieve this

Sorry, have no idea how you could do that in Dashboard though doubtless it is possible with enough coding.

With uibuilder and VueJS, you could use one of the drag-drop components for Vue. I think that was raised in another thread some while back.

If you are using ui-table it is probably possible but need a little bit of JavaScript knowledge (or the openness to learn) and to read the docs:

(there is a drag and drop example included)

I wrote a little example to demonstrate copy paste here:

Perhaps it could give you a little kickstart.

looks like the Tabulator has the functionality I need, but there are som work to configure it in Node-red for a newbie....

Can yo tell me how to name the table through ui_control instead of

var table = new Tabulator("#example-table", {
data:tabledata,
autoColumns:true,
});

??

Kind regards

O

You right spotted the problem I already recognized this morning after I looked at the example code. I have to look in the code. Right now It is not possible (EDIT:) not doable but certainly It is doable.

But another way is perhaps to find a way to query the css selector by placing a callback on the destination table, send the selector name to Node-RED and modify the configuration of the source table with an ui_control message.

It would try the tableBuilding or tableBuild callback and place a debugger; statement there. Then inspect the this.table object and lookout for the selector. Then use this.send as described to send the data to Node-RED.
Look at the copy past example how to install / use a callback.

EDIT:
This is the selector of one of my tables: #ui_table-8137. I expect the id is given by the dashboard and therefore not changeable. So I would go the callback route.

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