Inconsistent behavior with AJAX and ViewState in .NET

Question

I'm finding that hitting the "Refresh" button on my browser will temporarily screw up the ViewState for controls inside an UpdatePanel.

Here's my situation : I made a custom WebControl that stores values in the ViewState. I put this control inside an UpdatePanel. When I hit the "refresh" button on my browser, it will temporarily wipe out the values in ViewState. However, on the next postback, the values that were in the ViewState before I hit "refresh" magically reappear.

This behavior screws up my webcontrol. After I hit "refresh," the control is returned to its initial state, since the ViewState is empty and IsPostBack is set to false. However, when I click on one of the postback controls within my WebControl, the WebControl will reload with the same values that were in ViewState before I hit "refresh."

Strangely, this only happens when I'm using AJAX. When my control is outside of an UpdatePanel, Firefox gives me it's standard message, "To display this page, Firefox must send information that will repeat any action (such as a search or order confirmation) that was performed earlier (Resend) (Cancel)." This is fine, because at least the behavior is consistent. However, I absolutely must use AJAX for this project.

So this is what I would like to do - I want to make the "refresh" behavior consistent. It would be best if hitting "refresh" didn't affect the ViewState at all. But if it has to wipe out the ViewState, that's fine, as long as the ViewState STAYS wiped out. None of this stuff with values disappearing and reappearing.

Oh yeah, and here's my example code :

using System;
using System.Data;
using System.Configuration;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;

namespace TestControls
{
    public class TestControl : WebControl
    {
        int _clickCount;
        bool _mustUpdate;

        protected override void LoadViewState(object savedState)
        {
            base.LoadViewState(savedState);

            _clickCount = ((int)ViewState["clickCount"]);
            _mustUpdate = ((bool)ViewState["mustUpdate"]);
        }

        protected override void OnLoad(EventArgs e)
        {
            base.OnLoad(e);

            Controls.Clear();
            ControlCreator();
        }

        private void ControlCreator()
        {
            Label tempLabel = new Label();
            LiteralControl tempLiteral = new LiteralControl("<br/><br/>");
            LinkButton tempLink = new LinkButton();

            tempLink.ID = "testLink";
            tempLink.Text = "Click me!";
            tempLink.Click += new EventHandler(tempLink_Click);

            tempLabel.ID = "testLabel";
            tempLabel.Text = _clickCount.ToString();

            Controls.Add(tempLabel);
            Controls.Add(tempLiteral);
            Controls.Add(tempLink);
        }

        void tempLink_Click(object sender, EventArgs e)
        {
            _clickCount++;
            _mustUpdate = true;
        }

        protected override void OnPreRender(EventArgs e)
        {
            base.OnPreRender(e);

            if (_mustUpdate)
            {
                Controls.Clear();
                ControlCreator();

                _mustUpdate = false;
            }
        }

        protected override object SaveViewState()
        {
            ViewState["clickCount"] = _clickCount;
            ViewState["mustUpdate"] = _mustUpdate;

            return base.SaveViewState();
        }
    }
}

Answer 1

Try the following...

    protected override void LoadViewState(object savedState)
    {
        if (savedState != null)
        {
            object[] myState = (object[])savedState;

            if (myState[0] != null) base.LoadViewState(myState[0]);
            if (myState[1] != null) _clickCount = ((int)myState[1]);
            if (myState[2] != null) _mustUpdate = ((bool)myState[2]);
        }
    }

    protected override object SaveViewState()
    {
        object[] allStates = new object[3];

        allStates[0] = base.SaveViewState();
        allStates[1] = _clickCount;
        allStates[2] = _mustUpdate;

        return allStates;
    }

Basically derived the above code from Control.LoadViewState Method and Control.SaveViewState Method from MSDN.

Answer 2

Your ViewState is not being saved. The SaveViewState override is for saving OBJECTS, not for putting stuff into the ViewState bag. The ViewState bag is already beyond the point of mnarking stuff dirty and changes you make will not be persisted. You need to create an object array to load/view the ViewState information.

Do what BlackMael shows.

Answer 3

Hmmm. Well, I implemented your suggestion, and it didn't make a difference. When I hit "refresh," the values in ViewState disappear. When I click on the linkbutton, the values (from before the "refresh") reappear.

Any other ideas?

Answer 4

As a reference here's a great article for understanding ViewState.

Answer 5

I just re-read your question and realised I missed something...

You are hitting the browsers refresh button!

Is this a problem? YES!

What happens when you hit the refresh button on the browser? It refreshes the current page. If there was a postback, it will resend the post data.

The AJAX callback may update the ViewState as far as the page is concerned but hitting the browser refresh button will re-post the old ViewState.

There is a wealth is discussion on the matter which you can Google.

One very simple idea is to perhaps store the information in Session state instead perhaps. That too also can have its own issue too of course. But it may achieve your immediate goal.

A tip for wiping the history of a postback (to prevent the re-post) is to redirect back to the same page again.

Answer 6

Huh. Food for thought. Thanks!