Create UI upload button using UI template button. Clicking the button will allow you to open a file dialog that will allow you to select the file then pass the file content to the payload.
-
-
Save Ha-Steve/0332805b3a04d6aecfe17c27ab81ad9f to your computer and use it in GitHub Desktop.
UI upload file button
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| [{"id":"c5268070.c55a3","type":"ui_template","z":"5d665294.f65f14","group":"c33a1024a72aa169","name":"Upload Btn","order":8,"width":"3","height":1,"format":"\n<body>\n<button class=\"md-raised md-button md-ink-ripple\" onclick=\"importData()\">Upload</button> \n\n<script>\nlet restoreScope = scope;\n\nfunction importData() {\n let input = document.createElement('input');\n input.type = 'file';\n input.id = 'restoreBtn';\n input.onchange = _ => {\n // you can use this method to get file and perform respective operations\n let fReader = new FileReader();\n fReader.readAsText(input.files[0]);\n fReader.onloadend = function(event){\n restoreScope.send({payload:event.target.result});}\n };\n input.click();\n}\n</script>\n</body>\n","storeOutMessages":true,"fwdInMessages":true,"templateScope":"local","x":270,"y":700,"wires":[["5e18b80e617a3db8"]]},{"id":"5e18b80e617a3db8","type":"debug","z":"5d665294.f65f14","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","statusVal":"","statusType":"auto","x":510,"y":700,"wires":[]},{"id":"c33a1024a72aa169","type":"ui_group","name":"Default","tab":"cc6c4310cf7b61cc","disp":true,"width":"6","collapse":false},{"id":"cc6c4310cf7b61cc","type":"ui_tab","name":"Home","icon":"dashboard","disabled":false,"hidden":false}] |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment