Dashboard button to start file download

First, the file can be downloaded via a template node form submission. So file download is not the problem.

But how to link the dashboard button to file download? That is: If a person clicks the download button, the the file will be downloaded. I know this might be simple but I can't fine an answer :sweat_smile:

The following is the flow:

[{"id":"6f7ed72f.4ba6b8","type":"debug","z":"c37fcc5b.b6edb","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","statusVal":"","statusType":"auto","x":910,"y":840,"wires":[]},{"id":"8a4440e7.4e8e7","type":"http in","z":"c37fcc5b.b6edb","name":"","url":"/data.csv","method":"get","upload":false,"swaggerDoc":"","x":590,"y":900,"wires":[["4fa2d392.0122bc"]]},{"id":"4fa2d392.0122bc","type":"file in","z":"c37fcc5b.b6edb","name":"","filename":"/home/pi/.node-red/public/data.csv","format":"","sendError":true,"x":880,"y":900,"wires":[["d659f021.5555f8"]]},{"id":"d659f021.5555f8","type":"http response","z":"c37fcc5b.b6edb","name":"","statusCode":"","headers":{},"x":1110,"y":900,"wires":[]},{"id":"f97e6e7e.09b18","type":"ui_button","z":"c37fcc5b.b6edb","name":"","group":"c4536f8a.ffdf5","order":2,"width":0,"height":0,"passthru":false,"label":"Download data","tooltip":"","color":"","bgcolor":"","icon":"","payload":"<a href=\"/data.csv\">","payloadType":"str","topic":"","topicType":"str","x":530,"y":840,"wires":[["d62d8837.b25338"]]},{"id":"d62d8837.b25338","type":"ui_template","z":"c37fcc5b.b6edb","group":"c4536f8a.ffdf5","name":"","order":16,"width":0,"height":0,"format":"<script>\n(function(scope) {\n  scope.$watch('msg', function(msg) {\n    if (msg) \n    {\n\n       // what will be the code here?\n    \n \n     }\n  });\n})(scope);\n</script>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":720,"y":840,"wires":[["6f7ed72f.4ba6b8"]]},{"id":"c4536f8a.ffdf5","type":"ui_group","name":"Data Export","tab":"71b53261.d60bec","order":2,"disp":true,"width":"12"},{"id":"71b53261.d60bec","type":"ui_tab","name":"Broadcasting temperature","icon":"dashboard","order":2,"disabled":false,"hidden":false}]

The dashboard button node is designed to send the payload back to node red. if you want to initiate a download you will have to use a template and your own button or a hyperlink.

I know how to use a template with a button inside the template, or a hyperlink to download the file.

I just don't like the look of the button inside the template, which is not consistent with Dashboard's button.

So there is no easy way to initiate the download from a Dashboard button? :joy:

No. It is designed to send a Payload to the server side.

Well, as it's web, anything is possible so you could use a script to hook the click event but that's a hack

The answer is to style the button you put in the template the same as the UI button.

Look at the styles that get applied in devtools

Thanks Steve. I will look into it.
I am not familiar with button style inside template node :sweat_smile:

try these...

<button class="md-raised md-button md-ink-ripple" type="button">template button</button>

<md-button>template md-button</button>

Thanks and I will try it out.