Hello there, How to create nested table? I have tried with template node using html but then how to pass on the value coming through mag.payload? is there any other way to create nested table? Please help me with this!

The ui_template creates a table like this: [image] And if you press inject button, the payload is an array of objects sent to the ui_template and it updates cells according to payload. [image] No need to connect to anything. It is working example of how to create such table using the ui_template node.

You haven't said how you are outputting the table. Is it to Dashboard? Or some other custom output? uibuilder, for example, will allow nested tables but it isn't quite as easy as the ui_table node in Dashboard (which, as far as I know, does not support nested tables - though I may be wrong - you might need to look up the docs for the underlying library that is used). With uibuilder's zero-code nodes, you would have to create the main table and then have a second node that inserted the nested table into the specific cell you wanted. You would not be able to create a nested table in each row/cell with the zero-code tools. To do that, you would need to get your head around the low-code data-driven outputs (you could use the zero-code uib-element node to get you started though).

It's on the dashboard. here I am attaching output table. [Screenshot (238)] Index Numbers are written in the cell. Edit: I have used html in template node. [{"id":"1a0756f6.37b799","type":"ui_template","z":"d79ec1d.70ac04","group":"5d119f7c.dc0ec","name":"","order":0,"width":0,"singleBrowser":false,"height":0,"format":" \n \n\n \n\n\t \n\t\t\n\t\t \n 1 \n Name Of Unit \n PRIMA AUTOMATION PVT. LTD. [ INDIA ] \n \n\n \n 2 \n Address \n PLOT NO :- 793, RAKANPUR ,TAL.KALOL,DIST GANDHINAGAR ,PIN 382721 \n \n\n \n 3 \n Name of Responsible Person & Contact No. \n MR. PRAKASH MISTRY , CONTACT NO. 9898194552 \n \n\n \n 4 \n GPCB ID NO.CCA Status \n CC& A NO :- AWH - 31941 ,dated 17/03/2009 ,Valid till 17/12/2013 \n \n\n\t\t\n\t\t \n\t\t\t 5 \n\t\t\t Name & Quantity Of Product \n\t\t\t \n\t\t\t\t \n\t\t\t\t\t \n\t\t\t\t\t \" \" \n\t\t\t\t\t \" \" \n\t\t\t\t\t \n\t\t\t\t\t \n\t\t\t\t\t Sr. No. \n\t\t\t\t\t\t Product \n\t\t\t\t\t \n\t\t\t\t\t \n\t\t\t\t\t\t 1 \n\t\t\t\t\t\t Enclosure( \n\t\t\t\t\t \n\t\t\t\t \n\t\t\t \n\t\t\t \n\t\t\t \t \n\t\t\t \t \n\t\t\t \t Consent Qty. \n\t\t\t \t \n\t\t\t \t \n\t\t\t \t No/Month \n\t\t\t \t MT/Month \n\t\t\t \t \n\t\t\t \t \n\t\t\t \t 1200 \n\t\t\t \t 80 \n\t\t\t \t \n\t\t\t \t \n\t\t\t \n\t\t \n\n\t \n \n\n \n","storeOutMessages":true,"fwdInMessages":true,"templateScope":"local","x":660,"y":480,"wires":[[]],"_type":"node"},{"id":"5d119f7c.dc0ec","type":"ui_group","z":"","name":"Default","tab":"33aa3e02.5dfc42","order":1,"disp":true,"width":"21","collapse":false,"_type":"config"},{"id":"33aa3e02.5dfc42","type":"ui_tab","z":"","name":"Home","icon":"dashboard","publicAccess":"true","fmAccess":"none","fmAccessType":"private","assetType":"","asset":"","assetName":"","assetText":"","image":"","description":"","hideTitleBar":false,"_type":"config"}]

I'd go for grid layout. Nothing too complicated and easy to find support from web. [{"id":"767b5429298c1692","type":"ui_template","z":"09deee63c1b960f7","group":"40c7539325a10955","name":"Grid table","order":0,"width":"10","height":"3","format":" \n .grid-container{\n position: relative;\n }\n .gr-table{\n display:grid;\n grid-template-columns:2em 3fr 2fr 2fr 3fr \n }\n .gr-cell{\n background-color: rgb(114 114 114);\n border: 1px solid rgba(0, 0, 0, 0.8);\n padding: 0.5em;\n font-size: 16px;\n text-align: center;\n }\n .gr-table #cell_2{\n grid-column: 3 / span 2;\n }\n\n \n \n 0 \n 1 \n 2 \n 3 \n 4 \n 5 \n 6 \n 7 \n 8 \n 9 \n 10 \n 11 \n 12 \n 13 \n \n\n \n(function(scope) {\n scope.$watch('msg', function(msg) {\n if (msg) {\n msg.payload.forEach(el => {\n $(\"#gr_table_\"+scope.$id).find('#cell_'+el.id).text(el.value)\n })\n }\n });\n})(scope);\n ","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","className":"grid-container","x":480,"y":2500,"wires":[[]]},{"id":"906bada449638198","type":"inject","z":"09deee63c1b960f7","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"[{\"id\":0,\"value\":\"1\"},{\"id\":1,\"value\":\"Header 1\"},{\"id\":2,\"value\":\"Header 2\"},{\"id\":6,\"value\":\"content 6\"},{\"id\":7,\"value\":\"content 7\"}]","payloadType":"json","x":330,"y":2500,"wires":[["767b5429298c1692"]]},{"id":"40c7539325a10955","type":"ui_group","name":"Table","tab":"8482b305c416b850","order":2,"disp":true,"width":"10","collapse":false,"className":""},{"id":"8482b305c416b850","type":"ui_tab","name":"Away","icon":"dashboard","order":4,"disabled":false,"hidden":false}]

Sorry but please could you explain me in detail. What should I do with this. I meant I have to give output of this template in table node or what? I have given it to table node but getting something as below. [Screenshot (240)]

[image] Jhankhana: how to pass on the value coming through mag.payload Thank you so much for your great help!

Please help me bit more. Can I export this table as PDF? or how can I export table or data as pdf??

@Jhankhana Please don't ask the same question in two different threads. [image] PDF from dashboard General Hello there! need your help! How we can data in pdf format as exactly shown on the dashboard? can we get grid table written in template node as pdf? is it possible to do such thing?

[image] Jhankhana: Can I export this table as PDF? or how can I export table or data as pdf?? Your browser should be able to do that. Or maybe your OS provides a print to PDF.

Node-RED

Node-RED Forum

Nested table in node red

Dashboard

zenofmud 28 March 2023 10:45 9

@Jhankhana Please don't ask the same question in two different threads.

Topic		Replies	Views
Ui-table and nested tables Dashboard	0	536	1 February 2021
Help with nested data on tables Dashboard node-red-dashboard	2	118	19 July 2024
Node-red ui-table not working on IBM cloud Dashboard	16	1037	9 July 2020
How does it function : node-red-node-ui-table? Dashboard	3	786	12 October 2020
From msg.payload to table Dashboard	8	2140	15 May 2020

Copyright OpenJS Foundation and Node-RED contributors. All rights reserved. The OpenJS Foundation has registered trademarks and uses trademarks. For a list of trademarks of the OpenJS Foundation, please see our Trademark Policy and Trademark List. Trademarks and logos not indicated on the list of OpenJS Foundation trademarks are trademarks™ or registered® trademarks of their respective holders. Use of them does not imply any affiliation with or endorsement by them.

Nested table in node red

Related topics