How to open a link from a button?

Anvil Q&A
#1

Hello,
I have split my app in two smaller ones. I would like the “confirm” button from the first app to open the second one.
I can add a link with an icon to the second app to do so, but I don’t know how to do it with a button:
What function should I call to open a link from the button handler?

Trying to send my user to a different site - revisited
#2

Hi @Galdred, and welcome to the forum!

Unfortunately, due to browser pop-up blocking, it’s tricky to open a new tab from arbitrary code. If you want to open a new URL, you’ll want to use a Link component. (If you want it to look nicer, you can put other components - eg an Image - inside a Link, so it’s not just text and an icon.)

#3

Hi @meredydd, in the olden javascript days I would have simulated the click on a link. I was expecting this to work, but it doesn’t. Why?

def button_1_click (self, **event_args):
  if confirm('Do you want to start the other app?'):
    self.link_1.raise_event('click')
#4

That’s because the Anvil event process is in Python, and doesn’t rely on the Javascript event process (thank goodness!). Anyway, if you simulate a click on a link, half the time the page won’t open because it’ll get caught by the browser’s pop-up blocker. (And we open Links in new pages because browsers don’t like navigating from HTTPS to HTTP pages, at least inside the IDE…)

You could do it with a Custom HTML form and call_js() setting window.location - but fair warning, that will behave strangely inside the IDE.

#5

That makes sense, but is there a way to simulate the work of a button with an image link?
I would like the link to be disabled (and the image to be greyed, or another image to be displayed) if a checkbox is not ticked .

#6

You could have two images and load them dynamically, depending on the checkbox state (and updated using the checkbox events).

Here’s an example (ok, ridiculously big pictures but it was all I had around to prove a point :slight_smile:

https://anvil.works/ide#clone:FSK33HRB7ZD4G6BD=J3A2ZBCUS6LQW7D77LA3OMZJ

How to make a link open in the current tab
#7

Thanks! I did it with an image inside the link in the end, but apparently, you can also direclty add a button inside the link :slight_smile:

#8

This seem to be working reliably now:

import anvil.js
url = anvil.server.call('function_that_returns_the_url_of_a_media_object')
anvil.js.window.location = url

I don’t know if it’s reliable because url is in the same domain of the app or if this could be a reliable generic solution.

#9

@everyone

The Simplest most pythonic answer to that is the included Python Module webbrowser

In Order to open a link from a button, in the button click event function add this:

import webbrowser

def button_1_click(self,**event_args):
    webbrowser.open('link_here')
12 Likes
#10

Yes.

You can create a link that looks like this

2022-11-01--10-41-39

With this configuration

2022-11-01--10-42-01

You can control the visibility of that element just like any other element.

1 Like
#11

I know this is old news, but if anyone like me comes to it fresh, I’ve found that:

js.window.location.assign('url')

in the click event works just fine 99.999% of the time and gives users the in-browser back to the Anvil app.

What I found with window.open() is that is leaves the focus event hanging on the button when they close the new tab and come back.

1 Like