Keep value after postback - 【StackMirror】|c#|javascript|asp.net

I have an ASP.NET web site with something similar to the following code:

.aspx

<asp:UpdatePanel ID="UpdatePanel" runat="server">
    <ContentTemplate>
        <table id="RatesTable">
            <tr>
                <td>Hotel</td>
                <td>&nbsp;</td>
            </tr>
            <tr id="NewRateRow">
                <td>
                    <asp:DropDownList ID="TxtHotel" runat="server" OnSelectedIndexChanged="TxtHotel_SelectedIndexChanged" AutoPostBack="true">
                    </asp:DropDownList>
                </td>
                <td>
                    <a href="javascript:AddHotelPackRate()">Add</a>
                </td>
            </tr>
        </table>
    </ContentTemplate>
</asp:UpdatePanel>

AddHotelPackRate JS function, reads the value in the dropdown and "draws" a new row at the beginning of the table, containing this value. The problem is that after this, when the SelectIndexChanged function is executed again, the row that was added before, now disappears.

Is there a way to avoid losing this type of information after postback?

2012-04-04 20:28
by Gonzalo

You should add it again (recreate it) after postback, so you can save the information needed to recreate it in a hidden field and read this information after postback to recreate the additional row. However, the question is if you really need postback after changing item selected in the drop down list? This way it might be more intuitive to the user and you could avoid this issue - Lukasz M 2012-04-04 20:34

@Lucas I need postback to retrieve some information from the selected value. I thought about saving the information in a hidden field and then recreating the rows, the problem is that it's not just one cell as in the example above, and eventually there will be hundreds of rows, and I definitely don't want to access the db after each row is added.. But I guess there's no other solutio - Gonzalo 2012-04-04 20:41

You'll either have to have the content added by JS inside of the updatepanel, or you'll need to add whatever data the JS code added in the postback so that it continues to exist when the data is re-drawn.

The easy way is probably just to have AddHotelPackRate cause an updatepanel update that adds the row via server side code along with any other database/etc. changes so that it will continue to persist.

Edit: another comment also brings up the fact that you could just not update the update panel when the selected item changes, thus avoiding the issue entirely (in a different way).

2012-04-04 20:32
by Servy

Postback is needed because I need to retrieve infromation from the selected value, so I can populate other dropdowns in the row. I was looking forward to avoid accessing the database after each row was created, but I guess there's no other option. Thanks - Gonzalo 2012-04-04 20:54

I didn't add it at first because I just assumed it was there for a valid reason, but having the sanity check that it really should be there is good for future readers - Servy 2012-04-04 20:59

@anon downvoter, care to explain - Servy 2012-04-04 21:02

-1

The problem is you didn't add a triggr to your update panel. Change your code to this:

<asp:UpdatePanel ID="UpdatePanel" runat="server">
<ContentTemplate>
    <table id="RatesTable">
        <tr>
            <td>Hotel</td>
            <td>&nbsp;</td>
        </tr>
        <tr id="NewRateRow">
            <td>
                <asp:DropDownList ID="TxtHotel" runat="server" OnSelectedIndexChanged="TxtHotel_SelectedIndexChanged" AutoPostBack="true">
                </asp:DropDownList>
            </td>
            <td>
                <a href="javascript:AddHotelPackRate()">Add</a>
            </td>
        </tr>
    </table>
</ContentTemplate>
<Triggers>
   <asp:AsyncPostBackTrigger ControlID="TxtHotel" EventName="SelectedIndexChanged" />
</Triggers>
</asp:UpdatePanel>

2012-04-04 20:35
by Wahtever

The problem is that the updatepanel update re-writes the entire content of the updatepanel, and the server doesn't know about the javascript changes, so they don't persist. The problem isn't that he has a full postback - Servy 2012-04-04 20:36

@Servy - from what i understood, the problem is that when executing the selectedindexChanged with autopostback set to true will do a post back and then empty the current created rows. maybe i understood wrong - Wahtever 2012-04-04 20:40

The problem wasn't a full page postback, the postback was correctly going to the update panel and doing it's whole AJAX thing. The problem is that the way UpdatePanels update the data was causing him problems. Your code will do exactly the same thing as the code in the OP; the problem will still exist - Servy 2012-04-04 21:01