Friday, May 23, 2008

Detect back button of browser

It is common issue among asp.net programmers detecting back button and control browser back button. Let's see a scenario that you used some logic in page load but because user used back button, the page is loaded from their browser's cache. Unfortunately you cannot control that but you can write some code to simulate reloading as long as your client accept cookie. Download the code

Understand the situation:

Let's say we have 2 pages and from first page we are redirecting to second page and in second page the back button of browser is clicked so we need to reload the first page.

Solution:

I am going to use cookie to handle this because cookie is something that can be shared between server and client. In first page I am going to save name of first page in cookie. Then when we navigate to second page again we will write the name of second page in cookie. When users click on back button we will check the value of cookie in javascript if they are not the same we will load that page again.

See the code:

1- Helper class(in Asp.net code)

In this class I have to method one for add and set the cookie and another for removing cookie from client browser.

2- First page code(in asp.net)

In this page first in page load I am setting the page name in cookie so if I have a post back in this page the code that we will write in server will not cause reloading in a loop. Also before redirecting to second page I am setting the second page name in cookie

3- Second Page code

In this page just I am applying the same structure. Important always in page load you should set in which page you are in specially if you have multiple redirections in each page.

4- See the javascript code in common.js

As you see in javascript I am trying to see what we have in cookie is the same as the current page name otherwise we are reloading the page. The second method here is a helper method to read cookie.

5- Pages html code

For each page we need call the javascript method in load event.

6- Removing Cookie

It is extremely important to remove this cookie otherwise sometimes your users will see the page is reloading over and over the best place to remove the cookie is in your first page or in your login page. You can call Helper method to do this.

Download the code

15 comments:

hamid_h671 said...

dear emad
i am glad fo visit your website. you are my alwayes best teacher.
i have a question about Connection Manager .if i want evry user use a discrete connection , what should i do?
please help me.
thanks.
hamid hoseini (sazehgostar)

NASER said...

Hi dear emad,
this is naser abiat from nisoc(ahwaz)
very glad to see you are teaching c# again,now we have a chance to use your experience. I'll download all of your uploads!
can you write about your job conditions there, maybe some pictures from the office ;)
thanx

Emad Yazdanpanah said...

Hey guys,
you are all Rock. I missed a lot. It seems that I am finding my family.
Be ready for so many many lessons. I'll promise it never ends. I am going to extend this lessons as much as I can.
Here in AU everything is perfect. See you guys around.

Chuweet Babu said...

Excellent Solution!

Really i am very much suffered from this problem....

I tried with viewstate, session, clear cache etc.... but everytime it will fail at some situation..

it is a nice solution!

Welcome for your solution

mrit said...

hi, i am a newbie in asp.net 3.5. i liked ur solution, but not checked yet. anyways, m frm bangalore.. want to speak to plzzz.. plz reply here..
thanks a lot

mrit said...

i used this code in the page load event handeller:

HttpContext.Current.Response.Cache.SetExpires(DateTime.UtcNow.AddDays(-1));
HttpContext.Current.Response.Cache.SetValidUntilExpires(false);
HttpContext.Current.Response.Cache.SetRevalidation(HttpCacheRevalidation.AllCaches);
HttpContext.Current.Response.Cache.SetCacheability(HttpCacheability.NoCache);
HttpContext.Current.Response.Cache.SetNoStore();

but still no result.. why this is so?? will this start functioning after installing Service Pack 1(i am using VS 2008)??...

Emad Yazdanpanah said...

Hi Mrit,
Can you please download the code and test
I am not using Cache object!

Emad Yazdanpanah said...
This comment has been removed by the author.
Bartosz said...

I have found easier solution by Victor Popov: just put OutputCache Location="None" directive in aspx file.

It worked for me! See: http://bytes.com/forum/thread253086.html

Bartosz said...

I have found easier solution by Victor Popov: just put OutputCache Location="None" directive in aspx file.

It worked for me! See: http://bytes.com/forum/thread253086.html

Anonymous said...

Pleas read this article for the same purpose and less code.

http://ranafaisal.wordpress.com/2009/02/20/disabling-browsers-back-functionality-on-logout-from-aspnet/

Hemant Savkar said...

Great Man

Jaimin Patel said...

Excellent Solution! Thanks.

Brooke Bryan said...

I have written my own JavaScript object which can be pasted right into your page and then you can set the actions you wish through a simple function.

Find out more at http://www.bajb.net/2010/02/browser-back-button-detection/

I hope this is useful for anyone looking to detect the back button click

Sweta Chotalia said...

Thanks Emad !! Your post was very much useful !!!