UIBuilder Using URL variables

Hi. Is it possible to use variables of this form when using UIBuilder?
https://example.com/uibuilder/?site=abc
I would like to create QR codes at a few different locations and would like the location 'auto-filled' without having to make a new UIBuilder node for each site.

I can think of a work around using redirects within NR, but the URL variable would be simpler.

Most probably. uibuilder just serves your html and js files and hadles the back and forth of messages between NR and your front end code ... its up to you to handle with your code any url parameters.
Read this article that describes how to get the URL parameters.

const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
const site = urlParams.get('site')  // 'abc'

If you are using VueJS, here is some information on using Vue to handle passed URL query parameters:

javascript - How can I get query parameters from a URL in Vue.js? - Stack Overflow

uibuilder doesn't care whether you pass parameters or not, that is handled purely by your front-end code. So grab the query parameters and send them back to Node-RED if you need to using uibuilder.send().

1 Like

Thank you both. I managed to get it working and learnt a lot in the process.
:grinning:

2 Likes

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.