Telerik Forums / UI for ASP.NET AJAX
This is a migrated thread and some comments may be shown as answers.

[Solved] resizing the scheduler

1 Answer 271 Views
Scheduler
This is a migrated thread and some comments may be shown as answers.
Andrew
Top achievements
Rank 1
Andrew asked on 14 May 2009, 04:25 PM
Hi

I am trying to resize the scheduler to fit 100% of the screen  (height and width) but i am struggling to get it to resize at all..and if it does it causes problems with the Radsplitbar dissapearing. Can you give me some hints as to how to get this to work correctly.

Heres the code i am using.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="calendars.aspx.cs" Inherits="modules_Admissions_calendars_calendars"  %> 
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/tr/xhtml11/dtd/xhtml11.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml">  
<head runat="server">  
 
<style type="text/css">    
    .disableDelete .rsAptDelete    
    {    
        display: none;    
    }      
</style>    
</head> 
<body style="background-color: White" > 
    <form id="form1" runat="server" > 
    <Telerik:RadScriptManager runat="Server" ID="RadScriptManager1" /> 
 
    <script type="text/javascript">  
 
        /* Firefox resize scrollable content */  
        function hideScrollableArea(sender, eventArgs) {  
            if ($telerik.isFirefox)  
                $telerik.$('.rsContentScrollArea').css('overflow', 'hidden');  
        }  
        function showScrollableArea(sender, eventArgs) {  
            if ($telerik.isFirefox)  
                $telerik.$('.rsContentScrollArea').css('overflow', 'auto');  
        }  
 
        function OnClientAppointmentEditing(sender, eventArgs)   
        {  
            var appointmentObject = eventArgs.get_appointment();  
 
            arrayAppointmentID = appointmentObject.get_id().split('_');  
 
            if (arrayAppointmentID[0].toUpperCase() != "INTERVIEW" && arrayAppointmentID[0].toUpperCase() != "VISIT")   
            {  
                eventArgs.set_cancel(true);  
            }  
            else   
            {  
                eventArgs.set_cancel(false);  
            }              
 
        }  
 
        function OnClientAppointmentMoveStart(sender, eventArgs)   
        {  
            var appointmentObject = eventArgs.get_appointment();  
 
            arrayAppointmentID = appointmentObject.get_id().split('_');  
     
            if (arrayAppointmentID[0].toUpperCase() != "INTERVIEW" && arrayAppointmentID[0].toUpperCase() != "VISIT")   
            {  
                eventArgs.set_cancel(true);  
            }  
            else   
            {  
                eventArgs.set_cancel(false);  
            }                                 
          
        }  
       
    </script> 
         
    <Telerik:RadAjaxManager runat="Server" ID="RadAjaxManager1">  
        <AjaxSettings> 
                <Telerik:AjaxSetting AjaxControlID="RadCalendar1">  
                <UpdatedControls>                   
                <Telerik:AjaxUpdatedControl ControlID="RadScheduler1" LoadingPanelID="RadAjaxLoadingPanel1" /> 
                </UpdatedControls> 
                </Telerik:AjaxSetting> 
 
                <Telerik:AjaxSetting AjaxControlID="RadCalendar2">  
                <UpdatedControls> 
                <Telerik:AjaxUpdatedControl ControlID="RadCalendar1" /> 
                <Telerik:AjaxUpdatedControl ControlID="RadScheduler1" LoadingPanelID="RadAjaxLoadingPanel1" /> 
                </UpdatedControls> 
                </Telerik:AjaxSetting> 
 
                <Telerik:AjaxSetting AjaxControlID="chkVisits">  
                <UpdatedControls> 
                <Telerik:AjaxUpdatedControl ControlID="RadScheduler1" LoadingPanelID="RadAjaxLoadingPanel1" /> 
                </UpdatedControls> 
                </Telerik:AjaxSetting> 
 
                <Telerik:AjaxSetting AjaxControlID="chkInterviews">  
                <UpdatedControls> 
                <Telerik:AjaxUpdatedControl ControlID="RadScheduler1" LoadingPanelID="RadAjaxLoadingPanel1" /> 
                </UpdatedControls> 
                </Telerik:AjaxSetting> 
 
                <Telerik:AjaxSetting AjaxControlID="chkDOB">  
                <UpdatedControls> 
                <Telerik:AjaxUpdatedControl ControlID="RadScheduler1" LoadingPanelID="RadAjaxLoadingPanel1" /> 
                </UpdatedControls> 
                </Telerik:AjaxSetting> 
 
                <Telerik:AjaxSetting AjaxControlID="chkRegistered">  
                <UpdatedControls> 
                 <Telerik:AjaxUpdatedControl ControlID="RadScheduler1" LoadingPanelID="RadAjaxLoadingPanel1" /> 
                </UpdatedControls> 
                </Telerik:AjaxSetting> 
                  
                <Telerik:AjaxSetting AjaxControlID="chkEnquiry">  
                <UpdatedControls> 
                <Telerik:AjaxUpdatedControl ControlID="RadScheduler1" LoadingPanelID="RadAjaxLoadingPanel1" /> 
                </UpdatedControls> 
                </Telerik:AjaxSetting> 
                  
                <Telerik:AjaxSetting AjaxControlID="chkProspectus">  
                <UpdatedControls> 
                <Telerik:AjaxUpdatedControl ControlID="RadScheduler1" LoadingPanelID="RadAjaxLoadingPanel1" /> 
                </UpdatedControls> 
                </Telerik:AjaxSetting> 
                  
                <Telerik:AjaxSetting AjaxControlID="chkWithdrawn">  
                <UpdatedControls> 
                <Telerik:AjaxUpdatedControl ControlID="RadScheduler1" LoadingPanelID="RadAjaxLoadingPanel1" /> 
                </UpdatedControls> 
                </Telerik:AjaxSetting> 
                  
                <Telerik:AjaxSetting AjaxControlID="chkRejected">  
                <UpdatedControls> 
                <Telerik:AjaxUpdatedControl ControlID="RadScheduler1" LoadingPanelID="RadAjaxLoadingPanel1" /> 
                </UpdatedControls> 
                </Telerik:AjaxSetting> 
                  
                <Telerik:AjaxSetting AjaxControlID="RadScheduler1">  
                <UpdatedControls> 
                <Telerik:AjaxUpdatedControl ControlID="RadScheduler1" LoadingPanelID="RadAjaxLoadingPanel1" /> 
                </UpdatedControls> 
                </Telerik:AjaxSetting> 
              
        </AjaxSettings> 
    </Telerik:RadAjaxManager> 
    <Telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Office2007"/>  
      
        <Telerik:RadSplitter runat="server" ID="RadSplitter1" PanesBorderSize="0" Width="500px" Height="552px" Skin="Office2007">                     
          
                <!-- the scheduler view --> 
                <Telerik:RadPane runat="Server" ID="leftPane" Scrolling="None" Width="800px" >              
                    <Telerik:RadScheduler Culture="en-GB" runat="server" ID="RadScheduler1" Skin="Office2007" EnableEmbeddedSkins="True" 
                        ShowFooter="true"  DayStartTime="08:00:00" DayEndTime="21:00:00" 
                        TimeZoneOffset="00:00:00" OverflowBehavior="Scroll" SelectedView="MonthView" Height="551px" 
                        TimelineView-UserSelectable="false" OnNavigationComplete="RadScheduler1_NavigationComplete" 
                        OnAppointmentDelete="RadScheduler1_AppointmentDelete" 
                        OnAppointmentUpdate="RadScheduler1_AppointmentUpdate" OnAppointmentInsert="RadScheduler1_AppointmentInsert" 
                        FirstDayOfWeek="Monday" LastDayOfWeek="Friday" CustomAttributeNames="customTitle" OnClientAppointmentEditing="OnClientAppointmentEditing"    
                        OnClientAppointmentMoveStart="OnClientAppointmentMoveStart" ShowAllDayRow="true">  
                        <AppointmentTemplate> 
                            <asp:Label ID="lblTitle" runat="server"><%# Eval("customTitle") %></asp:Label>   
                        </AppointmentTemplate>                       
                    </Telerik:RadScheduler>                  
                </Telerik:RadPane>                
                  
              <!--the bar to close the panel -->     
              <Telerik:RadSplitBar runat="server" ID="RadSplitBar2" CollapseMode="Backward" />    
                           
              <Telerik:RadPane runat="Server" ID="RightPane" Width="220px" MinWidth="0" MaxWidth="220"   
                    Scrolling="None" OnClientBeforeResize="hideScrollableArea" OnClientResized="showScrollableArea" 
                    OnClientBeforeExpand="hideScrollableArea" OnClientExpanded="showScrollableArea" 
                    OnClientBeforeCollapse="hideScrollableArea" OnClientCollapsed="showScrollableArea" > 
                      
                    <div class="calendar-container" align="center"> <!--  holds the calendar--> 
                      
                        <Telerik:RadCalendar runat="server" ID="RadCalendar1" Skin="Office2007" AutoPostBack="true" 
                            EnableMultiSelect="false" DayNameFormat="FirstTwoLetters" EnableNavigation="true" 
                            EnableMonthYearFastNavigation="false" OnSelectionChanged="RadCalendar1_SelectionChanged" 
                            > 
                        </Telerik:RadCalendar> 
                          
                    </div> 
                      
                     <!-- the checkbox selectors --> 
                    <Telerik:RadPanelBar runat="server" Skin="Office2007" ID="PanelBarMarketing" Width="100%">     
                        <Items>                            
                            <Telerik:RadPanelItem runat="server" Text="Marketing" Expanded="true">  
                                <Items> 
                                    <Telerik:RadPanelItem runat="server" ID="PanelBarMarketingCheckboxes">  
                                        <ItemTemplate> 
                                            <div> 
                                                <div> 
                                                    <asp:CheckBox ID="chkVisits" runat="server" Text="Visits" Checked="true" AutoPostBack="true" 
                                                        OnCheckedChanged="CheckBoxes_CheckedChanged" /> 
                                                </div> 
                                                <div> 
                                                    <asp:CheckBox ID="chkInterviews" runat="server" Text="Interviews" Checked="true" AutoPostBack="true" 
                                                        OnCheckedChanged="CheckBoxes_CheckedChanged" /> 
                                                </div> 
                                            </div> 
                                        </ItemTemplate> 
                                    </Telerik:RadPanelItem> 
                                </Items> 
                            </Telerik:RadPanelItem> 
                        </Items> 
                    </Telerik:RadPanelBar> 
                     <Telerik:RadPanelBar runat="server" Skin="Office2007" ID="PanelBarPupil" Width="100%">     
                        <Items>                            
                            <Telerik:RadPanelItem runat="server" Text="Pupil" Expanded="true">  
                                <Items> 
                                    <Telerik:RadPanelItem runat="server" ID="PanelBarPupilCheckboxes" > 
                                        <ItemTemplate> 
                                            <div> 
                                                <div > 
                                                    <asp:CheckBox ID="chkDOB" runat="server" Text="DOB" Checked="true" AutoPostBack="true" 
                                                        OnCheckedChanged="CheckBoxes_CheckedChanged" /> 
                                                </div> 
                                                <div> 
                                                    <asp:CheckBox ID="chkRegistered" runat="server" Text="Registered" Checked="true" AutoPostBack="true" 
                                                        OnCheckedChanged="CheckBoxes_CheckedChanged" /> 
                                                </div> 
                                                <div> 
                                                    <asp:CheckBox ID="chkEnquiry" runat="server" Text="Enquiry" Checked="true" AutoPostBack="true" 
                                                        OnCheckedChanged="CheckBoxes_CheckedChanged" /> 
                                                </div> 
                                                 <div> 
                                                    <asp:CheckBox ID="chkProspectus" runat="server" Text="Propsectus Sent" Checked="true" AutoPostBack="true" 
                                                        OnCheckedChanged="CheckBoxes_CheckedChanged" /> 
                                                </div> 
                                                <div> 
                                                    <asp:CheckBox ID="chkWithdrawn" runat="server" Text="Withdrawn" Checked="true" AutoPostBack="true" 
                                                        OnCheckedChanged="CheckBoxes_CheckedChanged" /> 
                                                </div> 
                                                <div> 
                                                    <asp:CheckBox ID="chkRejected" runat="server" Text="Rejected" Checked="true" AutoPostBack="true" 
                                                        OnCheckedChanged="CheckBoxes_CheckedChanged" /> 
                                                </div> 
                                            </div> 
                                        </ItemTemplate> 
                                    </Telerik:RadPanelItem> 
                                </Items> 
                            </Telerik:RadPanelItem> 
                        </Items> 
                    </Telerik:RadPanelBar> 
                </Telerik:RadPane> 
                  
        </Telerik:RadSplitter> 
 
    <!-- Critical Error Display --> 
    <table id="tblCriticalError" runat="server" width="100%" height="100%" visible="false">  
        <tr> 
            <td> 
                <iSAMS:InfoTable runat="server" ID="infCriticalError" StyleType="PageError" HeadingText="The following error occurred:" /> 
            </td> 
        </tr> 
    </table> 
    </form> 
</body> 
</html> 
 

Thanks

1 Answer, 1 is accepted

Sort by
0
Atanas Korchev
Telerik team
answered on 15 May 2009, 02:16 PM
Hi Greg,

Your splitter is configured to take 552px height. You should make it 100% if you want it to occupy the whole page. You can check this example for additional info.

Regards,
Albert
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
Tags
Scheduler
Asked by
Andrew
Top achievements
Rank 1
Answers by
Atanas Korchev
Telerik team
Share this question
or