Hello, I have a link which should be pointing to a file (download), but under certain circumstances it should show a popup instead.
I tried the link element, which can download a file, but cannot get it to show a popup. I cannot set a workflow on this element.
Using the text element I can show the popup (using a workflow) but don’t know how to open an external link with it.
Which element can do both? Or (better) how can I get the link element to show a popup?
Assuming you want to use a link for this (as opposed to a workflow action) there are a few options…
You can use some custom JavaScript to add an event listener to the link element. Then, under certain conditions you can run a workflow when that event (i.e. a click) is triggered, and set the link destination conditionally.
Use 2 elements - have a text element that runs a workflow, and a link element that links to the destination, and simply show/hide each one conditionally.
This one is a bit of a Bubble ‘cheat/hack’ but it seems to work just fine… use a text element and run a workflow, conditionally, when it is clicked. Then change the element into a link element and conditionally add the destination.
Here is an example of each of the 3 methods in action.
That said - I’m not really sure there is a need to use a link element at all for showing a file - you could just use a workflow, which is obviously much simpler…
But if, in this case (or any other case) you need/want to use a link (and there are plenty of good reasons why you might), then these are the three options.
Edit: actually, although method 3 does work, it’s not great - it’s flagging an issue, as Bubble doesn’t seem to like the destination being left empty on this element for some reason (even though it works for the other methods)… so I’d go with option 1 or 2.
But, as I said, I don’t see any particular reason why you need to use a link element here at all?..
Thanks for the extended answer. Actually I had started with option 3, since that seemed to be the easiest to perform.
When I try the workflow in your example, it works fine. When I use it in my app, I get a browser message (“do you want to leave this site? All changes won’t be saved”)
Only after pressing Cancel, I get the popup I need. When I press Leave, I get transferred to about:blank#blocked.
Any idea what is causing this? The only difference I can spot between your example and my app is that you have done it the other way around (by default the Destination URL is empty, and in your condition there is a URL. I have that switched).
About using a link: I just need to open a document. I learned that I should be using links for that…
Yeah, as I said… don’t use Option 3 - it’s a ‘hack’ and doesn’t seem to work reliably as (for some reason) in this case Bubble won’t accept an empty destination, even though it usually does (must be something to do with the element type conversion). And besides, even if it did work, as it’s a hack, Bubble could ‘fix’ it at any time and it stop it from working.
So use option 1 or 2
(or don’t use a link at all - I’m not sure why you need to just to open a file, there’s no real benefit to it - just use a workflow action instead).
Hoera! It worked!
I just made a text element and, indeed, created the link using a workflow. I did not know this was possible (why would the link element exist, then?). Anyway, works like a charm.
Thank you (again!)
