Using AJAX HistoryPoint to stop Browser Back Click.

The Scenario:
In many applications,particularly ECommerce, once past the Payment page , is the ThankYou page.
When the user lands in “ThankYou” page , we would NOT want him to click Browser back & go back again to Payment or any other older pages in that particular navigation chain.
The post below, shows a very simple way to do that using Sys.Application.addHistoryPoint method.
The Solution:
The Sys.Application.addHistoryPoint method lets us tap the Browser back/Forward click. It’s a much needed & great way to handle this click-event in our logic.
For more on this — http://msdn.microsoft.com/en-us/library/cc488538.aspx
I create a HistoryPoint, right when the page loads for the first time. So after the page is loaded & user clicks browser back, the add_navigate handler, reloads the same page again.
It’s pretty simple & easy, and can save us lot of mess.
The only issue is — the server-side Page_load will get executed every time the browser back click happens, as if the page is requested very first time.
IsPostback Or ScriptManager.IsInAsyncPostback does NOT help.
Hence you may use Session to run any one-time logic.
I developed 2 pages.
Page1 — Has just a button & on that button click , Page2 is loaded.
Now on Page2, for any Browser-Back button click, the application continues to stay on Page2.
Here’s the complete code
Page1.aspx.cs
protected void Button1_Click(object sender, EventArgs e)
{
Response.Redirect(“Page2.aspx”);
}
Page2.aspx
<script language=”javascript” type=”text/javascript”>
    //window.onload = function () {
        //Sys.Application.addHistoryPoint({ m: 1 }, “”);
//changed to work both in IE as well as FireFox
      $(document).ready(function () {  
     Sys.Application.addHistoryPoint({ m: 1 }, “”);  
         });
    }
</script>
<script language=”javascript” type=”text/javascript”>
      function page_init() {
          Sys.Application.add_navigate(onStateChanged);
      }
function onStateChanged(sender, e) {
          window.location.href = ‘Page2.aspx’
      }
</script>
<form id=”form1″ runat=”server”>
    <div>
        <asp:ScriptManager runat=”server” ID=”ScriptManager1″ EnablePartialRendering=”false” EnableHistory=”true”  />
           <script type=”text/javascript”>
               Sys.Application.add_init(page_init);
            </script>
    </div>
    Please click browser back button & verify you stay in the same page.
</form>
Page2.aspx.cs
protected void Page_Load(object sender, EventArgs e)
{
if (Session[“j1”] == null)
{
//do one-time tasks & Set this same session
int pp = 8;
Session[“j1”] = “abc”;
}
}
————————————————
That’s it. Let me know. Thanks!
Advertisements
This entry was posted in AJAXToolKit and tagged , , , . Bookmark the permalink.

2 Responses to Using AJAX HistoryPoint to stop Browser Back Click.

  1. Ms Goh says:

    May I know it got vb code? for this part.

  2. Harshil Shah says:

    Can i know how to implement the code in a master page, that is what url should i mention on the following line:-

    window.location.href = ‘Page2.aspx’

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s