Greetings!
We have a web application that we use a Rad Window component in to open edit windows for detail information. For the most part they work perfectly, except when it comes to setting the height of the window. These windows are all opened at different sizes depending on properties sent to the javascript as you can see below. Again, the widths all work correctly.
Below is the javascript used to set the properties of the window:
The width, behaviors and centering all work perfectly. The height not so much. Looking at the source in Firebug in Firefox, the tbody tag doesn't appear to receive the style attributes that the table gets, and thus pushes the height of the whole table too high. Attached is a screenshot of what i'm trying to explain.
If i edit the html in Firefox and add the style to the tbody tag, the window height sizes perfectly, but without the correct style attribute - you can see the extra white space in the screenshot.
It seems to affect Firefox and Chrome alike, and we are running the RadControls for Ajax v.2011.2.712.35. I noticed in another post someone recommended ensuring the doctype was correct on the page, and ours is:
IE (oddly enough) shows the RadWindow correctly, which is a first..
Is there something i'm missing?
Thanks,
Paul Wakeman
We have a web application that we use a Rad Window component in to open edit windows for detail information. For the most part they work perfectly, except when it comes to setting the height of the window. These windows are all opened at different sizes depending on properties sent to the javascript as you can see below. Again, the widths all work correctly.
Below is the javascript used to set the properties of the window:
functionopenNewCheckWindow(checkId, width, height) {//alert(checkId);varoWnd = radopen("/PerMar/Users/AddCheckToRequest_Users.aspx?CheckTypeId="+ checkId);oWnd.set_behaviors(Telerik.Web.UI.WindowBehaviors.Move + Telerik.Web.UI.WindowBehaviors.Close);oWnd.SetWidth(width);oWnd.SetHeight(height);oWnd.center();}
The width, behaviors and centering all work perfectly. The height not so much. Looking at the source in Firebug in Firefox, the tbody tag doesn't appear to receive the style attributes that the table gets, and thus pushes the height of the whole table too high. Attached is a screenshot of what i'm trying to explain.
If i edit the html in Firefox and add the style to the tbody tag, the window height sizes perfectly, but without the correct style attribute - you can see the extra white space in the screenshot.
It seems to affect Firefox and Chrome alike, and we are running the RadControls for Ajax v.2011.2.712.35. I noticed in another post someone recommended ensuring the doctype was correct on the page, and ours is:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">IE (oddly enough) shows the RadWindow correctly, which is a first..
Is there something i'm missing?
Thanks,
Paul Wakeman
1 Answer, 1 is accepted
0
Hi Paul,
This behavior is observed because there is a limitation to the height of an iframe in all browsers, but IE, and the RadWindow's content is actually an iframe when an external page is loaded. That being said we have taken into account this browser limitation and the height of the RadWindow is limited in non-IE browsers.
You can reproduce the same issue with no complex controls at all:
What I would suggest is that you do not set content with heights smaller than 150px.
If you want to have a smaller RadWindow you could use its ContentTemplate and add the controls directly there, instead of using an external page, if this is possible in your scenario.
As for setting the height to the <tbody> tag - this does not work on all browsers and therefore is not a solution we can implement in the code.
All the best,
Marin
the Telerik team
This behavior is observed because there is a limitation to the height of an iframe in all browsers, but IE, and the RadWindow's content is actually an iframe when an external page is loaded. That being said we have taken into account this browser limitation and the height of the RadWindow is limited in non-IE browsers.
You can reproduce the same issue with no complex controls at all:
<table style="height: 80px; border: 3px solid green"> <tr style="height: 100%"> <td style="height: 100%"> <iframe style="border: 1px solid red; height: 100%" src=""></iframe> </td> </tr> </table>What I would suggest is that you do not set content with heights smaller than 150px.
If you want to have a smaller RadWindow you could use its ContentTemplate and add the controls directly there, instead of using an external page, if this is possible in your scenario.
As for setting the height to the <tbody> tag - this does not work on all browsers and therefore is not a solution we can implement in the code.
All the best,
Marin
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now