Back/Forward browser buttons

Anvil Q&A
#1

I performed a couple of testing sessions and observed some new users using my test anvil app. Overall it went really well, but one part that REALLY bit them was the browser back/forward buttons

Here’s the typical situation. The user:

  1. Does something on the current screen
  2. Clicks on a navigation link on the left
  3. Performs the action on the new screen
  4. Hits the browser back button
  5. They end up with a blank page and very confused and don’t know what they did wrong.

This happened again and again, and i’m concerned its going to be a significant usability problem.

Any insights or observations anyone?

3 Likes
#2

Oh and one quick addition - this really was obvious on mac/mobile, where gesture navigation was normal. They went back one in history without even really thinking (two finger swipe right) and it confused them very quickly.

#3

I’ve done that sort of thing using AngularJS before.

From memory, I don’t think you can disable the back button, but you can pop up a ‘Are you sure you want to leave this page?’ alert.

You’d need a JavaScript function to do that. I think the relevant event is when the window unloads.

1 Like
#4

Thanks for the reply Owen.

Looks like i might be doing some AngularJS style routing with hashes! That’ll be a fun challenge, typing navigation and buttons together and routes, and python.

#5

Hi @phil,

Routing is something we definitely want to implement, for all these reasons! This is where I would like to plug our support plans - these give you the ability to “put your thumb on the scale” and prioritise certain features on our roadmap. So if you want to accelerate the arrival of a full routing system in Anvil, please do drop us a line at support@anvil.works.

#6

Excellent plug Meredydd! I emailed you a week or two ago asking about support plans, when I was having those script loading issues. I’ll re-send it.

Do I get a prize for most persistent and annoying poster yet? :slight_smile:

#7

Do I get a prize for most persistent and annoying poster yet? :slight_smile:

Not even slightly. Try harder :wink:

#8

I’ll wrestle you for that title :slight_smile:

#9

Challenge accepted!!! :slight_smile:

#10

Hi. Is there any news on this issue?
I cant find in the docs.

I think back key on the smartphone should back to previous page in the app…

thanks

hugs from brazilian devs!

#11

The hash routing dependency handles this nicely: Routing, navigation with URL Hash

I wouldn’t create an Anvil app these days without it.

#12

thanks @jshaffstall

lot of work to do…

Its a little more complicated than i expected…

But you are totaly right - users love intuitive apps.

One possible work around is disabing the back key… Do you know how to do it?

Then I will insert a home button on each form.

#13

One thing you could do here (if the aim is to prevent a user pushing the back button and unwittingly leaving the app) is to use the onbeforeunload function.

Linked topic with related conversation and info

Putting the function in your native libraries will give a warning when your user is about to navigate away from the app. You’ve probably seen it on the web generally when using other websites.

#14

I highly encourage you to put the work into learning the hash routing dependency. It isn’t as bad as it looks at first, and it totally transforms both the user experience and how you end up writing your apps.

3 Likes
#15

7 posts were split to a new topic: HashRouting - cannot read getItem of undefined