This is a migrated thread and some comments may be shown as answers.

Autosize not consistant

7 Answers 127 Views

Window

This is a migrated thread and some comments may be shown as answers.

Kim asked on 05 Sep 2013, 02:12 AM

radwindowgood.png

radwindowbad.png

I am throwing my arms up in the air.

I have a radwindow set to autosize. I have a fixed width and height div on my page. Sometimes the window opens correct, other times it opens with scroll bars. Please see attached images of me opening the exact item. (Ignore radwindow.png) Sometimes its right, sometimes not.

There does not seem to be any rhyme or reason for this. I really need help because I have to deliver this to the client 2 weeks ago.

Thanks

(btw, how do you delete a file from a post once its uploaded?)

7 Answers, 1 is accepted

answered on 05 Sep 2013, 03:03 PM

Hello Kim,

This is really strange behavior and I have not seen it before. What I can advise, without being able to debug it on my side, is that you take a look at the Autosizing issues help article for RadWindow. It explains the requirements and common issues with this feature, so if these guidelines are followed you should not experience such problems.

Perhaps you can simply add an overflow: hidden; rule to the sample CSS from the article. You can also examine the rendered content and remove the overflow from the top-level elements in the browser's dev toolbar, so you can find the one that is causing the scrollbar, and add a CSS rule that targets it. This seems like one or two pixels are off in the problematic case, so it removing the overflow from a certain element should not break the layout.

On deleting the image - I have done this. If you need an image removed you can post a request and we wil do it for you.

Regards,
Marin Bratanov
Telerik

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 the blog feed now.

answered on 19 Sep 2013, 07:26 AM

autosizing-RW.zip

Hi Kim,

The previous article I linked covers most issues with autosizing if its guidelines are followed.
I am adding a really simple page that you can use as a reference point. If you continue to have difficulties with this I strongly advise that you open a support ticket where you can send us the problematic pages so we can examine them.

Regards,
Marin Bratanov
Telerik

answered on 23 Sep 2013, 06:46 AM

Hi Kim,

I am able to replicate your issue in IE and Chrome. Please have a look at the following code I tried for your scenario which works as expected in most of the browsers.

ASPX: (MainPage.aspx)

<div>

<telerik:RadButton ID="RadButton1" runat="server" Text="Open" AutoPostBack="false"

OnClientClicked="openRadwindow">

</telerik:RadButton>

<telerik:RadWindow ID="RadWindow1" runat="server" Behaviors="None" NavigateUrl="Login.aspx"

AutoSize="true" Modal="true" VisibleStatusbar="false">

</telerik:RadWindow>

</div>

JavaScript: (MainPage.aspx)

<script type="text/javascript">

function openRadwindow(sender, args) {

var radwindow = $find('<%=RadWindow1.ClientID %>');

radwindow.show();

}

</script>

ASPX: (Login.aspx)

<body>

<form id="form1" runat="server">

<asp:ScriptManager ID="ScriptManager1" runat="server">

</asp:ScriptManager>

<div class="div-style">

<div class="div-content">

<table class="table1-style">

<tr>

<td style="width: 30px;">

<img src="login.png" style="height: 32px; width: 32px; border-width: 0px;" />

</td>

<td align="center">

<span style="color: White; font-size: 14px; font-style: normal;">Login</span>

</td>

</tr>

</table>

<br />

<table class="table2-style">

<tr>

<td style="text-align: left;">

Email:

</td>

<td>

<telerik:RadTextBox ID="RadTextBox1" runat="server" Width="200px">

</telerik:RadTextBox>

</td>

</tr>

<tr>

<td>

Password:

</td>

<td>

<telerik:RadTextBox ID="RadTextBox2" runat="server" TextMode="Password" Width="200px">

</telerik:RadTextBox>

</td>

</tr>

<tr>

<td colspan="2" style="text-align: center;">

<telerik:RadButton ID="RadButton1" runat="server" Text="Login">

</telerik:RadButton>

<telerik:RadButton ID="RadButton2" runat="server" Text="Cancel" AutoPostBack="false"

OnClientClicked="close">

</telerik:RadButton>

</td>

</tr>

<tr>

<td colspan="2" style="text-align: center;">

<a href="#" style="color: Black;">Forgot Password?</a>

</td>

</tr>

</table>

<br />

</div>

</form>

</body>

CSS :(Login.aspx)

<style type="text/css">

html, body, form

{

margin: 0;

padding: 0;

height: 100%;

}

body

{

font-size: 12px;

font-family: Calibri;

color: #696969;

}

.div-style

{

width: 360px;

}

.div-content

{

border-color: #666666;

border-style: none;

border-width: 1px;

}

.table1-style

{

background-color: #D40000;

width: 100%;

}

.table2-style

{

width: 100%;

margin: 0px auto;

}

</style>

JavaScript: (Login.aspx)

<script type="text/javascript">

function close(sender, args) {

GetRadWindow().close();

}

function GetRadWindow() {

var oWindow = null; if (window.radWindow)

oWindow = window.radWindow; else if (window.frameElement.radWindow)

oWindow = window.frameElement.radWindow; return oWindow;

}

</script>

Hope this helps,
Shinu.

answered on 24 Sep 2013, 01:16 PM

video.zip

Hello Kim,

You can send us a sample in a support ticket.

I also tried your site and things seemed to work fine for me, you can find a short video from my test attached here.

At this point the last suggestion I can make without having observed the problem is that you call the autoSize(false) method of the RadWindow in its OnClientPageLoaded event. You can even add a small timeout around it (even up to 200 or 300ms) to see if this helps - forcing a resize after all content is loaded on the content page.

Regards,
Marin Bratanov
Telerik

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

Autosize not consistant

7 Answers, 1 is accepted