1

I'm currently working with a client's website in which we are using ajax calls to show the content of the pages, we are doing this in a single div and obviously you don't move from the index. My client wants the browser's back button to work, but since you're not moving to a different page or anything, I don't think that's actually possible, is it? How can I explain my client this in a simple way?

The only way to do what he wants is with page transitions, but that means starting again with that section of the website and using time we don't have.

2
  • Do you think it's impossible as stated in your first paragraph, or that you don't have to implement it as stated in your second paragraph? Commented May 19, 2016 at 5:53
  • 2
    learn about JavaScript's history API… This is a perfectly reasonable request from your client and not terribly difficult implement. However, this gets a lot easier if you already have an MVC architecture on your front-end rather than an unstructured mess of jQuery Ajax calls and DOM updates. Also, navigation that doesn't leave there page can be handled with URL fragments: /foo#visible-page
    – amon
    Commented May 19, 2016 at 6:02

1 Answer 1

4

My client wants the browser's back button to work, but since you're not moving to a different page or anything, I don't think that's actually possible, is it?

No, it certainly is possible.

When you navigate within your app, you need to change window.location.hash or use window.history.pushState. This will create points in the browser history that can be moved back to without refreshing the page.

Then you need to listen to the onhashchange or onpopstate events to detect when the user has pushed the back/forward button. You've got take the information stored in the history or state and update your application to show what you were showing at that point in time.

But honestly, if you've not written your app to be able to do this from beginning, its probably going to be a real pain retrofitting your app now. This works naturally with certain app designs, but other app designs will be near impossible to make work.

Properly supporting the back button is pretty expected from client-side applications today. If you don't support it, or tell your client you can't, its not going to reflect very well on you. Whether or not you make it work for this client, learn how to do it for future projects.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.