node-red-dashboard v2.14.0
I don't even know how you manage to have it styled like this, for me it shows unstyled...
need dashboard 2.16.x
(well it is styled - but just the light style)
Just updated. Restarted NR, now none of the tables show at all. Plus i've got new errors but app.js being minified I can't debug...
Uncaught SyntaxError: Unexpected token <
at m (app.min.js:20)
at Function.globalEval (app.min.js:20)
at text script (app.min.js:20)
at Ut (app.min.js:20)
at k (app.min.js:20)
at XMLHttpRequest.<anonymous> (app.min.js:20)
at Object.send (app.min.js:20)
at Function.ajax (app.min.js:20)
at Function.w._evalUrl (app.min.js:20)
at Re (app.min.js:20)
or this one
Uncaught ReferenceError: Tabulator is not defined
at createTable (eval at <anonymous> (app.min.js:571), <anonymous>:20:41)
at eval (eval at <anonymous> (app.min.js:571), <anonymous>:29:37)
or that one
Uncaught TypeError: Cannot set property 'onchange' of null
at <anonymous>:2:56
at m (app.min.js:20)
at Re (app.min.js:20)
at w.fn.init.append (app.min.js:20)
at w.fn.init.<anonymous> (app.min.js:20)
at z (app.min.js:20)
at w.fn.init.html (app.min.js:20)
at app.min.js:571
at m.$digest (app.min.js:172)
at m.$apply (app.min.js:176)
or that one
TypeError: Cannot read property '$attrs' of undefined
at app.min.js:469
at Array.map (<anonymous>)
at Object.t.layoutDelegate (app.min.js:469)
at Object.layout (app.min.js:469)
at Object.callback (app.min.js:38)
at app.min.js:469
at Array.forEach (<anonymous>)
at app.min.js:469
at app.min.js:190
at Tg.completeTask (app.min.js:187)
probably need to - restart Node-RED server - refresh / flush cache at browser, etc
Thanks. Just did it. Still got some errors.
What is the 'tabulator' ?
app.min.js:20 GET 404 (Not Found)
https://mywebsite.mydomain.com/auto/ui/ui-table/js/tabulator.js
https://mywebsite.mydomain.com/auto/ui/ui-table/css/tabulator_midnight.min.css
Just to clarify the above URL :
/auto is httpRoot
The file definitely exists in
node_modules/node-red-node-ui-table/lib/js/tabulator.js
I also have found a reference to this tabulator file in
./node_modules/node-red-node-ui-table/node.js
the source reads
<script type='text/javascript' src='ui-table/js/tabulator.js'></script>
But what does the path ui-table gets mapped to ?
Well I replaced the paths to the tabulator.css and .js by CDN ones.
The way it is done, using expressJS's Get on a wildcard didn't work for me at all.
apologies - not keeping up with this. Is the ui-table node broken for you ?
What path do you have dashboard set for (ui.path) ? and httpRoot ?
(both in settings.js)
no need to apologise, you guys already doing an awesome work for our community of users !
httpRoot: /auto
the rest are commented
Actually I got the ui table working by downloading the tabulator.js and css , and making it available locally , then replacing the bottom of the node.js script in the ui-table widget to point to those paths.
The RED...get(something/* at the bottom of node.js didn't work for me.
Using the default node-red settings.js it works.
When I use httpNodeAuth/httpStaticAuth and change the user data directory on settings.js I get this:
Error: ENOENT: no such file or directory, stat '...myDir/node_modules/node-red-node-ui-table/lib/js/tabulator.js unhautorized'
I checked and the file exists.
My columns are dynamic so I can't set it manually on the node.
Is there a way to set the ALL column rows to 100% at once?
Any idea on that tabulator issue ?
I'm still having the problem
Cannot GET /auto/ui/ui-table/css/tabulator_midnight.min.css
it is supposed to be publishing the content of
node_modules/node-red-node-ui-table/lib/css
but it doesn't.
Again my settings are
httpRoot: /auto
the rest are commented (hence dashboard published on /auto/ui by default)
Nginx runs on the host and proxies requests for /auto to the docker container running node-red...
I had to copy the lib folder under /var/www and create a special location entry in nginx.
For reference here is my setup :
location /auto/ {
proxy_pass http://localhost:1880; # points to the local docker container
proxy_set_header X-Real-IP $remote_addr;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
location /auto/ui/ui-table/ {
alias /var/www/html/libs/node-red-node-ui-table/; # manually copied from node_modules/....
autoindex on;
autoindex_exact_size off;
autoindex_format html;
autoindex_localtime on;
}
}
Sorry but I could not help you with this issue. I installed ui-table for the palette and later from a github fork to perform a PR and in both cases it works without any flaws. I have to point out that I use two very standard installations on Windows 10. One for development running from the command line (mostly form within VS Code) and the other on my server running as a service.
I also had problems with references to static contend when I wrote a custom node (simply loading an image into the help panel) but I quickly gave up and liked it to my github. So no experience how to use and configure the node-js / Node-RED web server. In particular no docker an nginx experience.
Sorry, because I think the ui-table is a powerful widget to display a lot of data on a small area.
Just to make you envious or to encourage you to keep debugging:
my syslog server (work in progress)
or my Thermostats
1 Like
perhaps one thing ...
the css is linked to the path ui-table/css if you make an alias to ui-table the server perhaps link to /ui-table/ui-table/css and fails?
but in the filesystem it is stored under \node-red-node-ui-table\lib\css (as you see i have no clue)
So somewere the ui-table is replaced into lib. This most likely happens in the dashboard itself and alias definition are very likely to be problematic in this case.
Just a thought or two.
1 Like
CSS did the trick for me. I am now able to customize most important aspects of the table in order to make it a fit to my overall dashboard theme.
For reference if anybody wants to do something similar (just assign ui-template node to your ui-table's group):
[{"id":"eca62c1a.40bdf8","type":"ui_template","z":"113a5c80.015354","group":"c4aa95f6.0a88","name":"CSS: ui-table","order":1,"width":0,"height":0,"format":"<style>\n\n .tabulator{padding-left:2px;border:1px solid #000;background-color:#202529;font-size:17px}\n \n .tabulator .tabulator-header{border-bottom:0px solid #000;background-color:#202529}\n .tabulator-col-content{background-color:#202529;height:37px}\n\n .tabulator-row{min-height:31px;background-color:#181c1f}\n .tabulator-row:nth-child(2n){background-color:#202529}\n\n .tabulator-row .tabulator-cell{border-right:0px solid #888}\n .tabulator .tabulator-header .tabulator-col{border-right:0px solid #aaa}\n\n</style>","storeOutMessages":true,"fwdInMessages":true,"templateScope":"local","x":1290,"y":2970,"wires":[[]]},{"id":"c4aa95f6.0a88","type":"ui_group","z":"","name":"Default","tab":"b06ddd9b.614eb8","order":1,"disp":false,"width":"24","collapse":false},{"id":"b06ddd9b.614eb8","type":"ui_tab","z":"","name":"Home","icon":"dashboard"}]
Note:
- This one includes only those parameter I wanted to change. A lot more can be found in ./node_modules/node-red-node-ui-table/lib/css/tabulator??????...?????.css
- With .tabulator-row{min-height:31px} and .tabulator-col-content{height:37px} one can easily align the overall table-size to the corresponding group size
- I yet have to find out how to vertically align text in both, header and table cells ... any hint is highly appreciated
..... example below
4 Likes
Perhaps this helps:
You can use msg.ui_control to do that.
2 Likes
Thanks again, Christian. I looked at it already. However, following your advise concerning CSS and after I got an idea about how CSS works (sort of 
) I found this to be a lean and transparent solution for me 
