AjaxControlToolkit DropDownExtender inside a table always displays associated panel
- by Amanda Myer
I have a textarea that has the ajaxcontroltoolkit dropdownextender associated with it, and a panel that contains a gridview with the options for the user to select from.
Here is the code for these items:
<asp:UpdatePanel ID="updPnlView" UpdateMode="Conditional" runat="server">
<ContentTemplate>
<asp:TextBox ID="txtSiteName" runat="server" TextMode="MultiLine" Rows="4" Columns="33" ReadOnly="true" /></td>
<ajaxToolkit:DropDownExtender runat="server" ID="popupdropdown"
DropDownControlID="pnlGrid" TargetControlID="txtSiteName" />
<asp:Panel runat="server" ID="pnlGrid" Style="display: none; visibility: hidden" Height="300" ScrollBars="Vertical">
<asp:GridView ID="gvSite" runat="server" AutoGenerateColumns="False" Width="100%"
DataKeyNames="ID,FullAddress" DataSourceID="odsSite" OnRowDataBound="gvSite_RowDataBound"
ShowFooter="false" ShowHeader="false" OnSelectedIndexChanged="gvSite_SelectedIndexChanged" >
<Columns>
<asp:CommandField ButtonType="Link" SelectText="Select" ShowSelectButton="true" ItemStyle-CssClass="HiddenColumn" />
<asp:TemplateField >
<ItemTemplate>
<asp:Label ID="FullAddress" runat="server" Text='<%# Eval("FullAddress").ToString().Replace("\n", "<br/>") %>'></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:CheckBoxField DataField="DisabledFLG" ItemStyle-CssClass="HiddenColumn" />
</Columns>
</asp:GridView>
</asp:Panel>
<asp:ObjectDataSource ID="odsSite" runat="server" OldValuesParameterFormatString="original_{0}"
SelectMethod="GetList"
TypeName="SOM.DCO.MOGWAI.Bll.SiteManager"
onselecting="odsSite_Selecting" SortParameterName="SortExpression"
onselected="odsSite_Selected" >
<SelectParameters>
<asp:Parameter Name="myCriteria" Type="Object" />
<asp:Parameter Name="myIDs" Type="Object" />
<asp:Parameter Name="sortExpression" Type="String" />
<asp:Parameter Name="bypassCache" Type="Boolean" />
</SelectParameters>
</asp:ObjectDataSource>
</ContentTemplate>
</asp:UpdatePanel>
When I place this item inside a table (i.e. <table><tr><td>THE CODE ABOVE</td></tr></table>) the panel always shows completely open never hidden. It also completely fills out the available space within the TD and pushes all other text on the page down the screen.
If I take the associated controls out of the table, it works as expected. I have duplicated this issue in both Firefox and IE8.
What gives?