Michael Landy
Top achievements
Rank 1
Rank 1
Michael Landy
asked on 03 Mar 2010, 11:07 PM
I have dynamic content that goes into an RadAjaxPanel that is inside a RadWindow. The content I am adding has styles and float attributes to create a multi-column display of information. However, when I add the content to the window, the styles appear to be lost and my dynamic content is presented top down. In addition, the auto-resize ends up with scrollbars on my content...sometime. Other times is appears ok. It never works the first time the window is opened.
Is there a way to keep the dynamic content styles?
Here is the code setup for the RadWindow.
Is there a way to keep the dynamic content styles?
Here is the code setup for the RadWindow.
| <telerik:RadWindow ID="RadWindow1" runat="server" Animation="Fade" |
| AutoSize="True" Modal="True" Behavior="Resize, Close, Move" |
| Behaviors="Resize, Close, Move" InitialBehavior="None" Left="" |
| ShowContentDuringLoad="False" Top="" VisibleStatusbar="False" |
| VisibleTitlebar="False"> |
| <ContentTemplate> |
| <div id="criteriapanel" class="criteriapanel"> |
| <telerik:RadAjaxPanel ID="updatePanel" runat="server" |
| HorizontalAlign="NotSet" LoadingPanelID="RadAjaxLoadingPanel1" > |
| <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" Runat="server" |
| Height="39px" InitialDelayTime="300" IsSticky="True" MinDisplayTime="200" |
| Skin="Default" BackColor="yellow" OnClientShowing="MyClientShowing" OnClientHiding="MyClientHiding"> |
| </telerik:RadAjaxLoadingPanel> |
| </telerik:RadAjaxPanel> |
| <asp:Button runat="server" ID="GenerateReport" CssClass="button" Text="Generate Report" /> |
| <asp:Button runat="server" ID="CancelReport" CssClass="button" Text="Cancel" OnClientClick="CloseCriteria();return false;" /> |
| </div> |
| </ContentTemplate> |
| </telerik:RadWindow> |
5 Answers, 1 is accepted
0
Hello Michael,
Please make sure that you are using XHTML Doctype:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
If this doesn't help, it will be best to open a support ticket and to send us a small sample project that isolates the problem so we could check it locally.
Greetings,
Georgi Tunev
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
Please make sure that you are using XHTML Doctype:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
If this doesn't help, it will be best to open a support ticket and to send us a small sample project that isolates the problem so we could check it locally.
Greetings,
Georgi Tunev
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
Michael Landy
Top achievements
Rank 1
Rank 1
answered on 10 Mar 2010, 01:18 AM
The issue I have is that I wanted to have two columns. I used the CSS float tag on the two DIVs to show two columns. The problem is the RadWindow control only takes the width of the one of the DIVs and does not know that I wanted to divs in two columns. So, it resized only to the one div forcing the float div underneath it. By setting the width manually to show the DIVs side by side, I was fine.
So, the "autoresize" capability only can do so much.
Let me know if you think I am wrong.
So, the "autoresize" capability only can do so much.
Let me know if you think I am wrong.
0
Hello Michael,
I am still not sure that I completely understand your scenario's logic - in the code I see only one DIV. From your last post I see that you found a solution for your scenario, but if you want, you could send us a small sample in a support ticket and we will check it right away - if there is a problem with our control, we will fix it as soon as possible.
Sincerely yours,
Georgi Tunev
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
I am still not sure that I completely understand your scenario's logic - in the code I see only one DIV. From your last post I see that you found a solution for your scenario, but if you want, you could send us a small sample in a support ticket and we will check it right away - if there is a problem with our control, we will fix it as soon as possible.
Sincerely yours,
Georgi Tunev
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
Michael Landy
Top achievements
Rank 1
Rank 1
answered on 12 Mar 2010, 04:34 PM
The code above adds items dynamically, so it was a bad example. To reproduce the issue, here is what you can do.
1. Put two panels in the the ContentTemplate section. Put some text in each of them.
2. Set the width of the panels to 300px.
3. Using CSS, set the panel's "float" property to left. This would create side by side columns of the panel...if the browser window is big enough. If it is not, the panels will "float" where the second panel is moved underneath the first panel.
4. Open the window with these two panels and set the resize to true. The code rightlyfully attempts to get the largest panel size (300px) and generate the window to this size. This means that the panels are displayed vertically and not side by side.
To fix this issue, I added a third panel and set it's width to the combined width of panel 1 and 2. This panel does not float. Now the resize sees a much larger window size and places panel 1 and 2 side by side.
In the end, there is not a bug in the resize functionality. The problem was my understanding of how to force the width of a resizeable window so that it would render the two column display I wanted correctly.
I hope this helps.
1. Put two panels in the the ContentTemplate section. Put some text in each of them.
2. Set the width of the panels to 300px.
3. Using CSS, set the panel's "float" property to left. This would create side by side columns of the panel...if the browser window is big enough. If it is not, the panels will "float" where the second panel is moved underneath the first panel.
4. Open the window with these two panels and set the resize to true. The code rightlyfully attempts to get the largest panel size (300px) and generate the window to this size. This means that the panels are displayed vertically and not side by side.
To fix this issue, I added a third panel and set it's width to the combined width of panel 1 and 2. This panel does not float. Now the resize sees a much larger window size and places panel 1 and 2 side by side.
In the end, there is not a bug in the resize functionality. The problem was my understanding of how to force the width of a resizeable window so that it would render the two column display I wanted correctly.
I hope this helps.
0
Hi Michael,
Thank you for the details - I was able to reproduce the case. This behavior is due to the way the AutoSizing feature works when RadWindow is used as controls' container. To avoid it, you could use the workaround that you found, or as an alternative - you could wrap these 2 DIVs in a third one with its width equal to the sum of the 2 DIVs inside it.
Sincerely yours,
Georgi Tunev
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
Thank you for the details - I was able to reproduce the case. This behavior is due to the way the AutoSizing feature works when RadWindow is used as controls' container. To avoid it, you could use the workaround that you found, or as an alternative - you could wrap these 2 DIVs in a third one with its width equal to the sum of the 2 DIVs inside it.
Sincerely yours,
Georgi Tunev
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.