ASP.NET - ViewState - Client Side State Management

The ASP.NET ViewState is a client side state management technique which enables web pages to persist their state during postbacks. In the life cycle of a page, the current state of the page is hashed to a string and is saved into a hidden field. When opening a page with the View Source operation you can find the ViewState's hidden field by searching __VIEWSTATE keyword. An example of a ViewState on a web page can look like that:

<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE"       value="/wEPDwUBMA9kFgJmD2QWAgIDD2QWBgI" />

How ViewState Works?

To understand how ViewState works you need to understand the concept of page life cycle. Every time a page is requested it is going through the same phases of the page life cycle. You can take a look at the events of the page life cycle in the following figure that is taken from a MSDN article of Scott Mitchell - Understanding ASP.NET View State:

[img_assist|nid=3892|title=|desc=|link=none|align=none|width=424|height=342]

The two phases which are connected to the ViewState are called LoadViewState and SaveViewState. In the LoadViewState (occurs only after postbacks) all the data is retrieved from the ViewState hidden field and the hashed value is converted back to values that are populated into the control hierarchy of the page. In the SaveViewState the state that must be maintained during postbacks is collected from the page's controls by calling SaveViewState of each control. Then, the values are combined into a string that is being hashed and the result is stored in the ViewState hidden field.

EnableViewState Property

ViewState is enabled for every control by default. You can disable the ViewState of a control by putting false value in the EnableViewState property of the control. This action decrease your page size and also reduce the process time on the server side. Pay attention that if you need to save your state and you disable ViewState it is your responsibility to save the state somehow.

When to Disable ViewState?

When you have a read only controls. Also, when you have controls like GridView that use a lot of records. The drawback is that you will have to bind your controls in every postback. The gain is a smaller page, less bandwidth usage by your page and less process time of the server.

Page ViewState Property

ViewState is not only found on controls it's also a property of the Page class. You can use it to store custom ViewState data. When you have a small value (can be every serialized object) and you need to track it in every postback, you can use the ViewState. This is a temporary storage because when the user leaves the page the ViewState of the page is disposed and a new ViewState is built for the new page.

How to Use ViewState?

The next example will answer the question. Be aware! always check first if the ViewState object exists before making a cast.

#region Consts

private const string AGE = "Age";

#endregion
#region Properties

/// <summary>
/// The Property returns an age if the age
/// doesn't exists it returns -1.
/// </summary>

public int Age
{
get
{
if (ViewState[AGE] == null)

{
    ViewState[AGE] = -1;
}
return (int)ViewState[AGE];
}
set
{
ViewState[AGE] = value;
}
}
#endregion

In the example I have an Age property that I want to save in the ViewState. In the get operation I Check if the ViewState contains a value for age and if not I put a -1 to indicate that there is no age currently. After the check I'll always have a value for age in the ViewState (because I put -1 as default value) and therefore I return the value with a cast. The set operation is simple just put the value in the ViewState.

Summary

Lets sum up the post. Today I explained the first technique for client side state management - the ViewState.
The technique is commonly used but you should be familiar with the aspects of over using the technique and the drawbacks of the technique (page size, consume server process time and so on). In the next post I'll continue to explain the client side state management. For further reading about ViewState I recommend the article of Scott Mitchell.