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

Resizing Problem

1 Answer 88 Views

Window

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

Stuart Hemming asked on 22 Oct 2010, 08:59 PM

Please have a look at the code below.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!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>

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

<div>

<telerik:RadScriptManager runat="server"

ID="RadScriptManager1">

<Scripts>

<asp:ScriptReference Assembly="Telerik.Web.UI"

Name="Telerik.Web.UI.Common.Core.js"/>

<asp:ScriptReference Assembly="Telerik.Web.UI"

Name="Telerik.Web.UI.Common.jQuery.js"/>

<asp:ScriptReference Assembly="Telerik.Web.UI"

Name="Telerik.Web.UI.Common.jQueryInclude.js"/>

<asp:ScriptReference Path="~/AdvancedForm.js"/>

</Scripts>

</telerik:RadScriptManager>

</div>

<telerik:RadWindow ID="RadWindow1" runat="server"

Width="200px"

Height="60px"

VisibleOnPageLoad="true"

runat="server">

<ContentTemplate>

<telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">

<script type="text/javascript">

$(document).ready(function() {

var x = "#<%=RadSchedulerRecurrenceEditor1.ClientID %>_RecurrentAppointment";

$(x).click(function() {

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

setTimeout(function() {

if ($(x + ':checked').val() !== null) {

w.set_height(295);

w.set_width(620);

} else {

w.set_height(60);

w.set_width(200);

}

w.center();

}, 500);

});

</script>

</telerik:RadScriptBlock>

---

<telerik:RadSchedulerRecurrenceEditor ID="RadSchedulerRecurrenceEditor1" runat="server" BackColor="Yellow" >

</telerik:RadSchedulerRecurrenceEditor>

---

</ContentTemplate>

</telerik:RadWindow>

</form>

</body>

</html>

It represents an attempt to resize the window when client side code changes the content.

As you'll see if you run the code, clicking on the checkbox opens the Recurrence Editor (from RadScheduler) and the window resizes.

However, I don't seem to be able to get it to revert to the smaller size if the checkbox is unchecked again.

What am I missing?

--
Stuart

1 Answer, 1 is accepted

answered on 22 Oct 2010, 11:39 PM

Never mind, I've sorted it.

There were a couple of things. First off, the test I was using for the checkbox doesn't work in IE, so I modified it to read...

if ($(x).attr('checked')) {

which, in reflection is more readable any way.

The 2nd was something that I had never really appreciated; the height of a window includes the chrome. I don;t know why I didn't know this and as I'd left the statusbar on it was doing something to the calculations.

For those who are interested, my modified script looks like this ...

<script type="text/javascript">

$(document).ready(function() {

var x = "#<%=RadSchedulerRecurrenceEditor1.ClientID %>_RecurrentAppointment";

$(x).click(function() {

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

setTimeout(function() {

if ($(x).attr('checked')) {

w.set_height(295);

w.set_width(620);

} else {

w.set_height(100);

w.set_width(200);

}

w.center();

}, 500);

});

</script>

--
Stuart