When we use ComboBox in ModalPopup, it throws the client error and only thing in our sight is a bald TextBox instead of entire ComboBox in ModalPopup Panel. After debugging, we can find the error message is pointing to this line b.width=c+"px".
Actually, the ModalPopup behavior mix it up. So the only thing we need to do is
1. Put the ModalPopupExtender behind the Panel which contains ComboBox.
2. Set style "display" to "block"(default value if you don't set the value of it).
Check the sample as below:
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:Panel ID="panel" runat="server" >
<cc1:ComboBox ID="ComboBox1" runat="server" AutoPostBack="true" DropDownStyle="DropDown">
<asp:ListItem Value="0" Text="1" >Text 1</asp:ListItem>
<asp:ListItem Value="1" Text="2">Text 2</asp:ListItem>
<asp:ListItem Value="2" Text="3">Text 3</asp:ListItem>
</cc1:ComboBox>
</asp:Panel>
<cc1:ModalPopupExtender ID="MPE" runat="server" PopupControlID="panel" TargetControlID="LB"> ---Put ModalPopupExtender behind Panel "panel".---
</cc1:ModalPopupExtender>
<asp:LinkButton ID="LB" runat="server" Text="clickme">click</asp:LinkButton>
</asp:ScriptManager>
<asp:Panel ID="panel" runat="server" >
<cc1:ComboBox ID="ComboBox1" runat="server" AutoPostBack="true" DropDownStyle="DropDown">
<asp:ListItem Value="0" Text="1" >Text 1</asp:ListItem>
<asp:ListItem Value="1" Text="2">Text 2</asp:ListItem>
<asp:ListItem Value="2" Text="3">Text 3</asp:ListItem>
</cc1:ComboBox>
</asp:Panel>
<cc1:ModalPopupExtender ID="MPE" runat="server" PopupControlID="panel" TargetControlID="LB"> ---Put ModalPopupExtender behind Panel "panel".---
</cc1:ModalPopupExtender>
<asp:LinkButton ID="LB" runat="server" Text="clickme">click</asp:LinkButton>
Actually we have the second way to resolve this problem. The issue will be encountered as soon as the parent element of combobox is invisible(style display=none or visibility=hidden). So the simplest approach is we can set it visible after rending and set it back in pageLoad.
Input your modalpopup panel clientID and put the above script after document body and form content.
The same problem in this link: http://vincexu.blogspot.com/2009/07/ajaxcontroltoolkit-combobox-not-showing.html
14 comments:
I tried your code, but it isn't working. First of al there is an error.
' style="display:none"; should be style="display:none;"
The display:none is hidding part of the button on the combobox as well. If you leave out this style-element, the buttons shows correctly. However the dropdownlist still isn't working. I tried it via copy and paste??
Oh, thank you. I've made a mistake in my article, and I modified it now.
hi
does the problem solve ?
i have try this code but the drop time still can't been shown
please give the correct code.
your code is not working properly.
Thanks, worked for me.
The code is fine after my testing.
Hi
I am facing the same problem in tab container.
When I placed ajaxtoolkit combobox in a tabpane of tabcontainer, the drodownbutton and drop down list display are display. Here is my code.
How to resolve it?
http://vincexu.blogspot.com/2009/07/ajaxcontroltoolkit-combobox-not-showing.html
I tried your code, but it isn't working.
___________________
Vince
Your movies on demand
If it doesn't work, I guess it is all because the Panel is not invisible like the Combobox in TabContainer. As soon as the parent element of combobox is invisible(display=none or visibility=hidden), the combobox will pop out this kind of error. In this way, we can set the parent element to visble and set it back in pageLoad, which's like http://vincexu.blogspot.com/2009/07/ajaxcontroltoolkit-combobox-not-showing.html said.
hi.
i tried this solutions but the combobox's items appear behind the panel(modalpopupextender),
i need your help.
thank you.
Hi Vince, Why is the dropdownextender panel(the panel to be shown) goes to the back of the modalpopupextender panel(the modal panel)?
is it just me whos having this problem? Because I googled it but cannot find info to help me.
I want the dropdownextender panel infront of the modal popup.
please help.
thanks
I want to load database values into ajax toolkit combo box which is placed in Tab container's first tab pane based on the other dropdown list selectin value which is also placed in the same tab pane. Instead of using SQLDataSource, i want to load through code. It is working fine when it is placed in the outside of the tabpane but not working when it is place inside it. Can anyone help me please.
Sowmya.K
I want to load database values into ajax toolkit combo box which is placed in Tab container's first tab pane based on the other dropdown list selectin value which is also placed in the same tab pane. Instead of using SQLDataSource, i want to load through code. It is working fine when it is placed in the outside of the tabpane but not working when it is place inside it. Can anyone help me please.
Sowmya.K
Post a Comment