updatepanel and gridview information lost when back button clicked

I am relatively new to ASP.net and have a general question about how to accomplish something. I am self-taught so I am not as up to speed on the details of page events, view state, and session state as I would like to be.

I have a 3-page app.

Page One (location selection): user selects a county in a listbox, this triggers another listbox to populate with the routes that are present in the selected county. Once a route is selected, a gridview populates with features along the selected route (in the selected county). These features are interchanges, exits, mile markers, etc. The features gridview is selectable. The user selects a feature where they want to close a lane, clicks a "submit" button and goes to page two. Page one makes use of AJAX updatepanels for the dynamic listbox population of routes (given a selected county) and features gridview (given a selected county and route).

Page two (closure scenario): contains traffic and grade information for the selected feature and more choices about the lane closure.

Page three (results): tells the user what the backup is going to be if a lane is closed as per the given parameters at the selected location.  

All of the above is working. This is the main problem I would like to solve:

When a user clicks the browser's "back button" on page two, only the county listbox is selected when page 1 is loaded again...the route listbox is empty and the gridview is not visible. I would like for this page to look just like it did before the user clicked "submit." The county listbox is the only one not in an updatepanel, I suppose that is why it is selected and the others are not. Going back from page 3 to page 2 works fine (there are no update panels on page 2).

Any help is appreciated and for this I need general help about how to accomplish this. Should I use session variables or is there a trick with viewstate and/or page events that I am missing? Are the updatepanels causing my problems?

Thanks!
<!--not sure it will help, but here is my code on page 1-->
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server" />
            <table style="width: 750px;text-align:left" border="0">
            <tr><td>
            <h2>Lane Closure Decision Support System - Select Feature</h2>
            </td></tr>
            </table>
        <asp:Panel ID="Panel1" runat="server" Width="750px" BackColor="GhostWhite">
            <table style="width: 100%;" border="0" cellspacing="0" cellpadding="5">
                <tr>
                    <td rowspan="2" style="width: 33%; text-align: left">
                        1. Select County:<br />
                        <asp:ListBox ID="selCounty" runat="server" AutoPostBack="True" DataSourceID="ObjectDataSource1"
                            DataTextField="CO_NAME" DataValueField="NBR_TENN_C" Height="150px" Width="125px">
                        </asp:ListBox><asp:ObjectDataSource ID="ObjectDataSource1" runat="server" OldValuesParameterFormatString="original_{0}"
                            SelectMethod="GetData" TypeName="DataSet1TableAdapters.VW_SELCOUNTYTableAdapter">
                        </asp:ObjectDataSource>
                    </td>
                    <td colspan="2" style="text-align: left; width: 33%;" valign="top">
                        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                            <ContentTemplate>
                                2. Select Route<br />
                        <asp:ListBox ID="selRoute" runat="server" AutoPostBack="True" DataSourceID="ObjectDataSource2"
                            DataTextField="ROUTE_NAME" DataValueField="NBR_RTE" Height="62px" Width="166px">
                        </asp:ListBox><asp:ObjectDataSource ID="ObjectDataSource2" runat="server" OldValuesParameterFormatString="original_{0}"
                            SelectMethod="GetDataBy" TypeName="DataSet1TableAdapters.VW_SELROUTETableAdapter">
                            <SelectParameters>
                                <asp:ControlParameter ControlID="selCounty" Name="county" PropertyName="SelectedValue"
                                    Type="Decimal" />
                            </SelectParameters>
                        </asp:ObjectDataSource>
                                <asp:HiddenField ID="txtCounty" runat="server" />
                            </ContentTemplate>
                            <Triggers>
                                <asp:AsyncPostBackTrigger ControlID="selCounty" EventName="SelectedIndexChanged" />
                            </Triggers>
                        </asp:UpdatePanel></td>
                    <td colspan="1" style="width: 33%; text-align: left" valign="top">
                        <asp:UpdatePanel ID="UpdatePanel4" runat="server">
                            <ContentTemplate><asp:Label ID="lblDirection" runat="server" Text="3. Select Direction:"></asp:Label>
                        <asp:UpdatePanel ID="UpdatePanel2" runat="server" Visible="false">
                            <ContentTemplate>
                            <asp:RadioButtonList ID="selDirection" runat="server" AutoPostBack="True">
                        </asp:RadioButtonList>
                                <asp:HiddenField ID="txtRoute" runat="server" />
                            </ContentTemplate>
                            <Triggers>
                                <asp:AsyncPostBackTrigger ControlID="selRoute" EventName="SelectedIndexChanged" />
                            </Triggers>
                        </asp:UpdatePanel>
                            </ContentTemplate>
                        </asp:UpdatePanel>
                    </td>
                </tr>
                <tr>
                    <td colspan="3" style="text-align: center" valign="top">
                        <asp:UpdateProgress ID="UpdateProgress1" runat="server">
                            <ProgressTemplate>
                            <table border=0>
                            <tr valign=middle><td><img src="images/progress.gif" /></td><td>Loading, please wait...</td></tr></table>
                            </ProgressTemplate>
                        </asp:UpdateProgress>
                    </td>
                </tr>
                <tr>
                    <td colspan="4" style="text-align: left">4. Select Beginning Log Mile<asp:UpdatePanel ID="UpdatePanel3" runat="server">
                        <Triggers>
                            <asp:AsyncPostBackTrigger ControlID="selRoute" EventName="SelectedIndexChanged" />
                        </Triggers>
                            <ContentTemplate>
                            <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" CellPadding="4"
                            DataSourceID="ObjectDataSource3" ForeColor="#333333" GridLines="None" style="text-align: left" Width="100%" >
                            <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                            <Columns>
                                <asp:TemplateField>
                                    <ItemTemplate>
                                    <input name="selectedlm" type="radio" 
                                    value='<%# Eval("SECT_ID") & "," & Eval("LOG_MILE") & "," & Eval("DESCRIPTION") & "," & Eval("MILE_MARKER")%>' 
                                    />
                                    </ItemTemplate>
                                </asp:TemplateField>
                                <asp:BoundField DataField="LOG_MILE" HeaderText="Beginning log mile" SortExpression="LOG_MILE" />
                                <asp:BoundField DataField="MILE_MARKER" HeaderText="Mile marker" SortExpression="MILE_MARKER" />
                                <asp:BoundField DataField="DESCRIPTION" HeaderText="Description" SortExpression="DESCRIPTION" />
                            </Columns>
                            <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
                            <EditRowStyle BackColor="#999999" />
                            <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
                            <PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
                            <HeaderStyle BackColor="Green" Font-Bold="True" ForeColor="White" />
                            <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
                        </asp:GridView>
                        <asp:ObjectDataSource ID="ObjectDataSource3" runat="server" OldValuesParameterFormatString="original_{0}"
                            SelectMethod="GetData" TypeName="DataSet1TableAdapters.VW_SELFEATURESTableAdapter">
                            <SelectParameters>
                                <asp:ControlParameter ControlID="selCounty" Name="county" PropertyName="SelectedValue"
                                    Type="String" />
                                <asp:ControlParameter ControlID="selRoute" Name="route" PropertyName="SelectedValue"
                                    Type="String" />
                            </SelectParameters>
                        </asp:ObjectDataSource>
                            </ContentTemplate>
                        </asp:UpdatePanel>
                    </td>
                </tr>
            </table>
        </asp:Panel>
        <asp:Button ID="Button1" runat="server" Text="Input Closure Information" PostBackUrl="~/inputclosure.aspx" />
    </form>

Open in new window

dobbinjpAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

SteveH_UKCommented:
0
SteveH_UKCommented:
See also http://www.nikhilk.net/UpdateControls.aspx if you can't use the ASP.NET AJAX Futures release.
0
dobbinjpAuthor Commented:
Thanks for the quick response. I looked at each of these and it appears the history is more of a bookmark (e.g., default.aspx#top) on the same page. What I am looking for is general advice about how to retain a page's state when the user has navigated to the next page (not a bookmark).

I think the confusing part of this is the fact that I used AJAX update panels. I have a feeling had I not used that, the drop-downs and gridview would have remained populated.
0
Cloud Class® Course: Amazon Web Services - Basic

Are you thinking about creating an Amazon Web Services account for your business? Not sure where to start? In this course you’ll get an overview of the history of AWS and take a tour of their user interface.

SteveH_UKCommented:
When you use AJAX, the browser sends a request to the server to get updated data or respond to an event (such as selecting a list item).  However, the browser's history doesn't see it.  At this point, all the browser knows is the previous page and the current page, it doesn't know about the AJAX communication.  For this reason, you need to do two things:

1)  Add a bookmark in the history so that the user must click back several times in order to leave the page, depending on the number of AJAX events the user has initiated.
2)  Manage the changed AJAX state so that the previous state can be restored.

For (1), a history point must be added to the browser, but the contents are largely irrelevant, so long as it points to the current page.

(2) is a bit harder, though.  You are basically caching the previous state of the page so that when the user wants to navigate back, the state can be reloaded.  You can do this at the client or at the server.  You have to store the information needed to render the previous state, whether that is simple or complex.

The ASP.NET Futures History control lets you do both (1) and (2), but it is up to your code to store the data needed for (2), as described in the article.

So, the bookmarks are used purely to keep the user on the current page.  State is maintained separately.  This process is required for AJAX precisely because the browser does not move to a new page.

For your final concern about how to return to a previous page when you've navigated to a new one, this is one of two things:

1)  Navigating to the previous page with a new request.  This is what happens when the user clicks a button you provide that does not use the browser's "back" behaviour.  In this case you must support cross-page posting and pass the state between requests, using request data (such as form controls), session state or a database.
2)  Navigating when the user clicks Back in the browser.  In these cases the state management described above will help out
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
dobbinjpAuthor Commented:
SteveH,

Thanks for helping me out with this problem. I think I understand now how to go about this.

Thanks again,

-Jimmy
0
SteveH_UKCommented:
You're welcome.  Thanks for the points.
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
ASP.NET

From novice to tech pro — start learning today.