What can cause a page to lose its viewstate when doing a browser back?

Question

I have a page which the user gets shown when he wants to create a new or edit an existing document. There are two UserControls on the page. One simple DatePicker and a more complex grid. After filling out or editing the data he then can press continue which brings him to the review page where he can decide to really create or update the document or go back and change something. Going back is done in javascript with a history.back()

Now when the user is in "new" mode and decides to go back from the review page the grid partially looses its viewstate and the DatePicker loses it completly.

On the other hand when the user is in "edit" mode and goes back from the review page both controls maintain their viewstate.

I know that the browser just shows the cached version of the "new/edit" page. But why the difference in the state of the controls and what can I do so that it works in both cases?

Answer 1

Viewstate is essentially a hidden field in the form that gets populated with the control values that have been posted back to the server.

If a user enters or selects some values in the form's controls, performs a postback and then presses the browser's back button or does a javascript history.back(), you are viewing the page as it was before the postback took place. Therefore, the choices made by the user prior to the postback will not be present on the page.

The difference between "new" and "edit" is that on "edit" you are retrieving information from the database to populate the controls.

Instead of doing javascript history.back(), you should look into using a Wizard control. The wizard control is designed for this very purpose. If the user enters information in multiple steps, goes to the review page and needs to go back a step or all the way back to the first step everything is maintained in Viewstate.