Can the table scroll UNDER a template?

[Christian-Me]

The feature is called „select“ row! And it is included in the last example. Here is the doc:

Tabulator - Interactive JavaScript Tables

Think setting “selectable“:1 should highlight only the last selected row.

@dceejay I mentioned it a while ago that there is no limit for the widget hight if set to auto in ui-table hight always = amount of rows. Do you think a limit is usefull? I never use auto so I don‘t care

[thebaldgeek]

Thanks for your help @Christian-Me

The last example is copy-paste...

It does not highlight the selected row.... What am I doing wrong?

I can't figure out the link between Tabulator and Node-RED... sorry.

As for 'Auto' height, never used it in any of my ~30 odd dashboard pages so cant offer much there.

[thebaldgeek]

Ah. I have been looking at that one for a while....

When you click on a row in that example, it does not highlight, but you do get a message 'an error occurred'.... That's a start.

Thanks for pointing me in the right direction.

[Christian-Me]

Think you have to update ui-table first. It is example 6:

[Christian-Me]

This is sent if you switch the selectable button to on. true means multi selection. if you send a 1 should get what you want:

[Christian-Me]

And to totally confuse you: you can do the details in ui-table directly using the responsive layout feature:

[Announce] remote device table (and collaboration wanted)

Hello after a lot of work (perhaps too much work) I like to share my first beta version of a flow to display the status of remote devices on the dashboard. It is always good to have an eye on your sensors and actuators especially when they are connected wireless or battery powered. The flow first developed around my homie-convention-node but soon I decided to make it more versatile because I have devices around the house which not support the homie convention. [teaser] Currently supported are…

Something for long lockdown nights instead of going into the local bar.

[thebaldgeek]

Thanks.
Confused enough...

msg.ui_control.tabulator[selectable]=1;
is throwing; "TypeError: Cannot read property 'tabulator' of undefined"
So yeah, its very confusing for a low-code guy like me.... will keep chipping at it, hopefully will get something we can post here for others.

[Christian-Me]

Use the ui-control node and send on „change“

msg.ui_control.tabulator.selectable=1

to ui-table

Or together with your payload

[thebaldgeek]

That's not an option.

But I think I get where you are headed.... I was missing the fact that I have to 'detect' the row click and handle it as a different event.

[Christian-Me]

"change tab or ..." is the right option, You can see the output in the demo flow (on the dashboard and with the debug nodes. Every row click send a standard message. if you need other function you have to write your own callback function

[thebaldgeek]

For those following along or finding this via a search.. After more than a few hours work I have had to give up and move on.
The ui control node just does not output anything (ever), so thus I cant detect a table row selection.
Such is life.

Thanks everyone for you help.
Making the table shorter makes a big usability improvement to the system.

[dceejay]

eh ? that doesn't compute - the ui_control node will provide a change event every time the dashboard connects or changes tab (or every deploy)... the ui_table node provides events when you click on a row.

What is being suggested is to use the ui_control change event to provide an input to the table to tell it to be selectable. - You also then need to catch any select event from the table and save it so that it know which row was selected, so you can then feed that back in on next change, etc.

[thebaldgeek]

I totally agree. Makes no sense at all.
Here is how things look.

And here is what I have selected in the UI Control Node.

I have been using Node-RED for over 5 years and have a bizillian hours into this project and honestly, this is the first time it just flat out has not worked... no errors, and no debug messages. It just simply does not do anything.
You can click that row all you like and nothing will ever get detected.
The only time you get a debug message is when you change tabs in the dashboard.

At first I thought it was because I was using the wrong ui table node.
I had node-red-ui-node-table nodes installed. So I exported everything, uninstalled that node and installed
node-red-node-ui-table and reimported all my tables (that took about an hour).
Here is the table node I am now using.

No difference at all.
Still no row click events.

Node-RED ver 1.2.7 (Windows 10 home)
nod-red-node-ui-table ver 0.3.10
node version 10.16.3

[dceejay]

Errr. The click events come out if the table node. So you need a debug on that.

[thebaldgeek]

Wow.... I sure feel like a total noob.
Ok, getting click events.
Just need to figure out how to action them....

[thebaldgeek]

@Christian-Me Could I get a little nudge to point me in the right direction please?
Have now got a message that includes the row number on each click.
But I am unclear how to send it back to the table node...
Here is the code and the debug message.

Here is how I have the flow setup to catch every click on the table.

Thanks.

EDIT. Never mind. Refresh the browser and its working.

For those following along, this will highlight the selected row in a table.
To recap....

Second Edit based on Christian-Me extra info a few posts down..
The ui control node does not output anything (as per dceejay post just above this one) so does not need to be hooked to anything.

1. Install the correct table node. You want node-red-node-ui-table.
2. Place a ui control node on the flow, select 'Change tab or group events only' from the drop down menu.
3. Place a function node on your flow.
4. The function node code is as follows. (Just cut and paste it all in).

msg.ui_control = {tabulator:{}};

msg.ui_control.tabulator.selectable=1;

return msg;

5. Deploy and refresh your browser.

[Christian-Me]

In the documents you find how to select rows (Tabulator)

So it is a "command" or procedure call done by sending a object to ui_table:

A Function node prepares the object and sets msg.row as the parameter for selectRow

msg.payload={
    "command": "selectRow",
    "arguments": [
        msg.row
    ],
    "returnPromise": false
}
return msg;

You find more info in the help panel or in the readme.md of ui_table

[Christian-Me]

Some thoughts!

• Your select row function node does NOT select a row! It only aktivate the selection feature of ui-table!
• to select a row you have to send the selectRow(yourID) to ui_table
• your ui-control node does nothing to your flow (not wired to anything). Suggestion:

@thebaldgeek

But I am unclear how to send it back to the table node...

• Just to make this clear. The command is only needed if you wish to select a row by Node-RED to highlight a value change for example. There is no need to "send it back".

[Christian-Me]

and trigger all ui-controll events should avoid browser refresh. perhaps check with your debug node if the ui_controll message is sent after deploy

[thebaldgeek]

Thanks for the extra info. I have edited my post above to reflect your input.

The ui control does not output anything (for the table row selection) so does not need to be connected to anything - since its not sending a message.

I think the main difference is that I only wanted to highlight the row, not do anything with the data (its already sent to the template node on selection).