locked
back button history in asp.net 4.5 MVC RRS feed

  • Question

  • User-1098042928 posted

    Hi,

    I am working on a website using ASP.net 4.5 MVC and I navigate across pages using Ajax.ActionLink which would update a common section I put in Layout page. Now my back button does not work as I update my common section with partial views as I navigate across pages.

    Can anyone suggest a solution for preserving history with browser's back/forward button. I found the following solutions  on internet but are not working for MVC website.

    1) I saw javascript history (http://blogs.gokulnath.com/2012/02/26/EnableBrowserBackforwardButtonsAndBookmarkMVCAjaxActions.aspx), But this is not considering the <controller>/<action method/ in the URL.

    2) I see asp.net history control but it does not work in as I deal with views.

    Let me know if there is any solution specific to asp.net 4.5 mvc for this back button history problem.

    Thanks,

    Praveen

    Monday, May 4, 2015 6:35 PM

All replies

  • User724169276 posted

    There is no such readymade way to handle this behaviour , one workaround that you can follow is to refresh the partial view on ready event of jquery.

    $(document).ready(function() {
       // refresh your partial view here.
    });

    Tuesday, May 5, 2015 3:51 AM
  • User1644755831 posted

    Hello praveenb,

    You could try to use history.js plugin for this. you will need to implement this on the client side. Here is a demo for this http://browserstate.github.io/history.js/demo/. You could when browser refreshed using back button check what the history is using this plugin. 

    Here is an example

    (function(window,undefined){
    
        // Bind to StateChange Event
        History.Adapter.bind(window,'statechange',function(){ // Note: We are using statechange instead of popstate
            var State = History.getState(); // Note: We are using History.getState() instead of event.state
        });
    
        // Change our States
        History.pushState({state:1}, "State 1", "?state=1"); // logs {state:1}, "State 1", "?state=1"
        History.pushState({state:2}, "State 2", "?state=2"); // logs {state:2}, "State 2", "?state=2"
        History.replaceState({state:3}, "State 3", "?state=3"); // logs {state:3}, "State 3", "?state=3"
        History.pushState(null, null, "?state=4"); // logs {}, '', "?state=4"
        History.back(); // logs {state:3}, "State 3", "?state=3"
        History.back(); // logs {state:1}, "State 1", "?state=1"
        History.back(); // logs {}, "Home Page", "?"
        History.go(2); // logs {state:3}, "State 3", "?state=3"
    
    })(window);

    Hope this helps.

    With Regards,

    Krunal Parekh 

    Wednesday, May 6, 2015 11:08 PM