Wednesday, March 28, 2012

List controls not refreshing in UpdatePanels

I'm trying to figure out why when I click Remove on any listbox the postback doesn't refresh the listbox to show the change. I thought that every updatepanel refreshes. If this is so, then why isn't my listbox automatically reloading the updated list after I remove an item? I end up having to refresh the whole page manually in order to see any removed items from my listboxes

<%@dotnet.itags.org. Control Language="vb" AutoEventWireup="false" CodeBehind="Main.ascx.vb" Inherits="xxxx" %>

<asp:scriptmanager id="ScriptManager1" runat="server" />

<table class="medium" border="0" cellpadding="0" cellspacing="0" width="100%">

<tr style="padding-left 5px;">

<!-- Left Content Bucket -->

<td valign="top">

<table align="left" border="0" cellpadding="0" cellspacing="2" width="100%">

<tr>

<td height="20"></td>

</tr>

<tr>

<td class="tableHdrBlack" colspan="2">

<asp:label id="GeneralInformationHeader" runat="server" />

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="Program" runat="server" />

</td>

<td align="left" valign="top">

<asp:dropdownlist id="ddlPrograms" runat="server" width="300px" />

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="Cuent" runat="server" />

</td>

<td align="left" valign="top">

<asp:updatepanel id="CuentUpdatePanel" runat="server">

<contenttemplate>

<asp:listbox id="lbCuent" runat="server" width="214px" /><br />

</contenttemplate>

</asp:updatepanel>

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="ApdCs" runat="server" />

</td>

<asp:updatepanel id="ApdCsUpdatepanel" runat="server">

<contenttemplate>

<td align="left" valign="top">

<asp:listbox id="lbApdCs" runat="server" width="214px" /><br />

<asp:button id="btnAddApdCs" runat="server" width="63px" />

<asp:button id="btnRemoveApdCs" runat="server" width="83px" />

</td>

</tr>

<asp:panel id="pnlAddApdCs" runat="server" visible="false">

<tr>

<td>

</td>

<td>

<table>

<tr>

<td>

<asp:dropdownlist id="ddlAddApdCs" runat="server" width="90px" />

</td>

<td>

<asp:button id="btnInsertApdCs" runat="server" width="50px" />

</td>

</tr>

</table>

</td>

</tr>

</asp:panel>

</contenttemplate>

</asp:updatepanel>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="FtyMang" runat="server" />

</td>

<td align="left" valign="top">

<asp:listbox id="lbFtyMang" runat="server" width="214px" />

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="lHDee" runat="server" />

</td>

<td align="left" valign="top">

<asp:updatepanel id="HDee" runat="server">

<contenttemplate>

<asp:listbox id="lbHDee" runat="server" width="214px" /><br />

<asp:button id="btnAddHDee" runat="server" width="63px" />

<asp:button id="btnRemoveHDee" runat="server" width="83px" />

</contenttemplate>

</asp:updatepanel>

</td>

</tr>

<asp:panel id="pnlAddHDee" runat="server" visible="false">

<tr>

<td>

</td>

<td>

<table>

<tr>

<td>

<asp:dropdownlist id="ddlAddHDee" runat="server" width="90px" />

</td>

<td>

<asp:button id="btnInsertHDee" runat="server" width="50px" />

</td>

</tr>

</table>

</td>

</tr>

</asp:panel>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="Ces" runat="server"></asp:label>

</td>

<td align="left" valign="top">

<asp:updatepanel id="CesUpdatepanel" runat="server">

<contenttemplate>

<asp:listbox id="lbCes" runat="server" width="214px" /><br />

<asp:button id="btnAddCes" runat="server" width="63px" />

<asp:button id="btnRemoveCes" runat="server" width="83px" />

</contenttemplate>

</asp:updatepanel>

</td>

</tr>

<asp:panel id="pnlAddCes" runat="server" visible="false">

<tr>

<td>

</td>

<td>

<table>

<tr>

<td>

<asp:dropdownlist id="ddlAddCes" runat="server" width="90px" />

</td>

<td>

<asp:button id="btnInsertCes" runat="server" width="50px" />

</td>

</tr>

</table>

</td>

</tr>

</asp:panel>

</table>

</td>

<td width="10px"></td>

<!-- Right Content Bucket -->

<td valign="top">

<asp:updatepanel id="FtyUpdatePanel" runat="server">

<contenttemplate>

<table align="left" border="0" cellpadding="0" cellspacing="2" width="100%">

<tr>

<td height="20"></td>

</tr>

<tr>

<td colspan="3" class="tableHdrBlack">

<asp:label id="FtyHeader" runat="server" />

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="left" valign="top" colspan="3">

<asp:label id="RealName" runat="server" />

</td>

</tr>

<tr>

<td></td>

<td align="left" colspan="3">

<table align="left" border="0" cellpadding="0" cellspacing="2">

<tr>

<td>

<asp:label id="lblFirstName" runat="server" />

</td>

<td align="left">

<asp:textbox id="FirstName" runat="server" width="150px" />

</td>

<td>

<asp:label id="lblLastName" runat="server" />

</td>

<td align="left">

<asp:textbox id="LastName" runat="server" width="150px" />

</td>

</tr>

</table>

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="left" valign="top" colspan="3">

<asp:label id="Address" runat="server" />

</td>

</tr>

<tr>

<td></td>

<td align="left" colspan="3">

<table align="left" border="0" cellpadding="0" cellspacing="2">

<tr>

<td>

<asp:label id="lblFtyStreet" runat="server"></asp:label>

</td>

<td colspan="5">

<asp:textbox id="FtyStreet" runat="server" width="340px" />

</td>

</tr>

<tr>

<td align="right">

<asp:label id="lblFtyCity" runat="server"></asp:label>

</td>

<td width="20px">

<asp:textbox id="FtyCity" runat="server" width="100px" />

</td>

<td align="right" width="20px">

<asp:label id="lblFtyState" runat="server" />

</td>

<td>

<asp:dropdownlist id="FtyStateList" runat="server" width="50px" />

</td>

<td align="right">

<asp:label id="lblFtyZip" runat="server" />

</td>

<td align="right">

<asp:textbox id="FtyZip" runat="server" width="100px" />

</td>

</tr>

</table>

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr align="left">

<td></td>

<td align="left" colspan="3">

<table align="left" border="0" cellpadding="0" cellspacing="2">

<tr>

<td>

<asp:label id="Phone" runat="server" />

</td>

<td>

<asp:textbox id="AreaCode" runat="server" width="53px" />

-

<asp:textbox id="Prefix" runat="server" width="58px" />

-

<asp:textbox id="Suffix" runat="server" width="68px" />

</td>

</tr>

</table>

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="left" colspan="3" valign="top">

<asp:label id="Shipping" runat="server" />

</td>

</tr>

<tr>

<td>

</td>

<td align="left" colspan="3">

<table align="left" border="0" cellpadding="0" cellspacing="2">

<tr>

<td>

<asp:label id="lblShippingStreet" runat="server" />

</td>

<td colspan="5">

<asp:textbox id="ShippingStreet" runat="server" width="340px" />

</td>

</tr>

<tr>

<td align="right">

<asp:label id="lblShippingCity" runat="server" />

</td>

<td width="20px">

<asp:textbox id="ShippingCity" runat="server" width="126px" />

</td>

<td align="right" width="20px">

<asp:label id="lblShippingState" runat="server" />

</td>

<td>

<asp:dropdownlist id="ShippingStateList" runat="server" width="50px" />

</td>

<td align="right">

<asp:label id="lblShippingZip" runat="server" />

</td>

<td align="right">

<asp:textbox id="ShippingZip" runat="server" width="100px" />

</td>

</tr>

<tr>

<td height="10">

</td>

</tr><tr>

<td>

</td>

<td align="left">

<asp:button id="btnUpdateFPenalInfo" runat="server" width="60px" />

</td>

</tr>

</table>

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td align="left" class="tableHdrBlack" colspan="3">

<asp:label id="CouTauder" runat="server" />

</td>

</tr>

<tr>

<td height="10"></td>

</tr>

<tr>

<td colspan="4">

<table align="left" border="0" cellpadding="0" cellspacing="2">

<tr>

<td align="right" valign="top">

<asp:label id="LastCourse" runat="server" />

</td>

<td align="left" valign="top">

<asp:label id="LatSsionValue" runat="server"/>

</td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="LatSsion" runat="server" />

</td>

<td align="left" valign="top">

<asp:label id="LatSsionValue" runat="server" />

</td>

</tr>

<tr>

<td align="right" valign="top">

<asp:label id="MisSeions" runat="server"/>

</td>

<td align="left">

<asp:label id="MisSeionsValue" runat="server" />

</td>

</tr>

<tr>

<td height="10">

</td>

</tr>

<tr>

<td align="left" valign="top">

<asp:label id="CourTt" runat="server" />

<br />

</td>

</tr>

<tr>

<td colspan="2">

<asp:gridview id="CourTtList" runat="server" />

</td>

</tr>

</table>

</td>

</tr>

</table>

</contenttemplate>

</asp:updatepanel>

</td>

</tr>

</table>

Hello,

How do you get the data into the listbox? Try this:
for example the list box inside this updatePanel

<asp:updatepanel id="CuentUpdatePanel" runat="server">
<contenttemplate>
<asp:listbox id="lbCuent" runat="server" width="214px" /><br />
</contenttemplate>
</asp:updatepanel>

After you click Remove, for sure you have to call a function right? In that function, also call: CuentUpdatePanel.Update()
This will update the UpdatePanel ... and if your list box uses a ObjectDataSource ... example below

<asp:updatepanel id="CuentUpdatePanel" runat="server">
<contenttemplate>
<asp:listbox id="lbCuent" runat="server" DataSourceID="GetListITems" width="214px" /><br />
</contenttemplate>
</asp:updatepanel>

then in your function, you do this: lbCuent.Databind();

Hope it helps ... by the way, next time don't bother post all of your HTML in here, too much, waste your time. =) just the part that you have problem is enough already ... and the code behind that is related to it ... Cheers


The problem is that I didn't rebind my listbox after whatever event (insert, delete, etc.)


I didn't even have to call the .Update() manually, it all works fine now after the obvious missing rebind of my listbox controls

No comments:

Post a Comment