Back Button Problem in AJAX

If you are starting out in your first Ajax based program, one of the biggest challenges that you have to face is to let your users remember not to hit the back button. Most of the time, Ajax based programs does not like the back button.

Unfortunately, Ajax does not have that functionality in bookmarking the previous page so that it could be reloaded anytime. With this development or some call it a disability; it is quite clear that today’s browsers were built without thinking of the possibility that a back might be extinct one day. It also goes to show that Ajax is way bigger than browsers and Ajax will definitely be going out of the browser one day.

Before we realize those realities, we have to acknowledge the fact that there is still a back button. The functionality of browser will be incomplete without a back button.

Back button function is a very efficient tool for everyone without which we might end up doing the same process all over again instead of just hitting back button to repeat the procedure. A back button should be implemented even in an Ajax based application.

It may sound like a complicated answer to the problem. But the only complication you would face in enabling the back button of your Ajax based application is developing this function for both Mozilla and IE web browser. Each of these browsers have their own configuration so that the back button could be used at any time.

Mozilla:

The first step in enabling the back button is to build a PageLocator function. This code will practically tell the browser where to go. If the webpage is built on different frames, the developer should specify the actual action to perform on previous action of the browser.

However, this code will practically let you go back to the previous webpage but will nevertheless reload. In a regular web-page such as an HTML based site, you can easily go back to the webpage especially the last state of the page before you left. Page locator will just let you go back and it is just like writing the link again in another browser.

To answer this, you have to add another function called setContent. But it does not end there, you have to add # in the parameters so that you will be exactly at where had to go and preserve the last state.

Internet Explorer:

On the other hand, IE needs a little different configuration compared to the Mozilla. In this account, it is highly recommended to use Dojo toolkit as they have a library that offers an easy functionality for an Ajax based function. The back button in this toolkit could be easily used.

Basically this library uses a lot of iFrame so that the webpage and state will be specified. Instead of using # for a more specified function, developers target .src and the load the webpage with the previous state. It is also necessary that a querystring be added that practically imitates the hash functionality.