Hi all,
I have found a problem with the ComboBox when placing the page form inside other elements. In my example I have placed the page form in an ASCX control. I have to do it that way because of the CMS I'm using.
The div outside the page form has a specific size and is centeret on the page.
Apparantly the ComboBox drop down is positioned from the page form. This means that the dropdown now appears way to the right of it's intended position.
What do I do?
ASPX Page:
ASCX Control
I have found a problem with the ComboBox when placing the page form inside other elements. In my example I have placed the page form in an ASCX control. I have to do it that way because of the CMS I'm using.
The div outside the page form has a specific size and is centeret on the page.
Apparantly the ComboBox drop down is positioned from the page form. This means that the dropdown now appears way to the right of it's intended position.
What do I do?
ASPX Page:
| <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="HourKid_Usercontrols.WebForm1" %> |
| <%@ Register Src="WebUserControl1.ascx" TagName="WebUserControl1" TagPrefix="uc1" %> |
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
| <html xmlns="http://www.w3.org/1999/xhtml"> |
| <head runat="server"> |
| <title></title> |
| </head> |
| <body> |
| <div style="width: 500px; height: 500px; margin: 0 auto; position: relative;"> |
| <uc1:WebUserControl1 ID="WebUserControl11" runat="server" /> |
| </div> |
| </body> |
| </html> |
ASCX Control
| <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="WebUserControl1.ascx.cs" |
| Inherits="HourKid_Usercontrols.WebUserControl1" %> |
| <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> |
| <form id="form1" runat="server"> |
| <telerik:RadScriptManager ID="RadScriptManager1" runat="server"> |
| </telerik:RadScriptManager> |
| <div style="padding: 100px;"> |
| <div style="float: right; position: relative;"> |
| <telerik:RadComboBox ID="RadCbShareMail" ValidationGroup="Share" runat="server" AllowCustomText="true" |
| Skin="Vista" EmptyMessage="sdfsdf" DataTextField="Email" DataValueField="Email" |
| ChangeTextOnKeyBoardNavigation="true" MarkFirstMatch="true"> |
| <Items> |
| <telerik:RadComboBoxItem Text="sdfa" /> |
| </Items> |
| </telerik:RadComboBox> |
| </div> |
| </div> |
| </form> |
4 Answers, 1 is accepted
0
Hello Rune,
Just remove the positioning of the outer DIV:
Regards,
Paul
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Just remove the positioning of the outer DIV:
| <div style="width: 500px; height: 500px; margin: 0 auto;"> |
| <uc1:WebUserControl ID="WebUserControl11" runat="server" /> |
| </div> |
Regards,
Paul
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Rune
Top achievements
Rank 2
Rank 2
answered on 15 Sep 2009, 12:41 PM
Hi Paul,
Yes I know that would be an option. But unfortunately that is part of the problem. The form is to be placed inside my design, so i cannot remove the outside positionings.
I don't see why the ComboBox is dependent of the Page Form tag. It should be dependent on the body or html tag, wich is ALLWAYS on the outside.
Would you recommend me to create a supportticket for the problem?
Yes I know that would be an option. But unfortunately that is part of the problem. The form is to be placed inside my design, so i cannot remove the outside positionings.
I don't see why the ComboBox is dependent of the Page Form tag. It should be dependent on the body or html tag, wich is ALLWAYS on the outside.
Would you recommend me to create a supportticket for the problem?
0
Hi Rune,
This is a hack, but may help you with your task. Add this function to the OnClientDropDownOpening handler of the RadComboBox:
function dropDownOpen(sender, args) {
var $ = $telerik.$;
setTimeout( function() { $(sender._animationContainer).appendTo(document.body); }, 0 );
}
Let me know if this helps.
Greetings,
Kamen Bundev
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
This is a hack, but may help you with your task. Add this function to the OnClientDropDownOpening handler of the RadComboBox:
function dropDownOpen(sender, args) {
var $ = $telerik.$;
setTimeout( function() { $(sender._animationContainer).appendTo(document.body); }, 0 );
}
Let me know if this helps.
Greetings,
Kamen Bundev
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
steve matheson
Top achievements
Rank 2
Rank 2
answered on 01 Feb 2010, 05:28 PM
I had the same problem and this worked like a charm!
Thanks!!
Thanks!!