Div's Class not persisting when 'back' button is used

Because you are not posting back to change the div's style, when the user hits the back button it is taking it back to how the page was originally posted. The easy way to fix this is to have the button cause a postback that toggles the style.


Store the setting in a cookie on the client side, then check the cookie via JavaScript on load of the page and change the CSS class. Other ways of fixing this might not work because the page isn't always requested from the server when a user hits the Back button.

using the jQuery cookie plugin

// this function will update the style of the divs based on the cookie's settings
function updateClass(){
    var val = $.cookie('myCookieName');

    // set your div's class
    if (!val || val=='divA')
    {
        $('#divA').removeClass('SearchDivDisabled');
        $('#divA').addClass('SearchDiv');
        $('#divB').removeClass('SearchDiv');
        $('#divB').addClass('SearchDivDisabled');
    }else{
        $('#divB').removeClass('SearchDivDisabled');
        $('#divB').addClass('SearchDiv');
        $('#divA').removeClass('SearchDiv');
        $('#divA').addClass('SearchDivDisabled');
    }
}

// call this passing in 'divA' or 'divB' depending on which is selected
function updatePage(selectedDiv){
    $.cookie('myCookieName', selectedDiv, { path: '/', expires: 10 });
    updateClass();
}

// change the class of the divs when the page is finished rendering
$(document).ready(function(){updateClass();}):

I don't think ViewState is the issue here; it may be something that needs managed in client-side javascript code, as switching states on the client doesn't get reflected automatically on the server...

What you want to look at potentially is the management of browser history through the history points feature: http://msdn.microsoft.com/en-us/library/cc488548.aspx

HTH.