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

RadScheduler Dynamic Width

12 Answers 512 Views

Scheduler

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

don asked on 06 Dec 2007, 04:31 AM

Dear Telerik,

On the MonthView of RadScheduler, I would like for the calendar to expand to fill the entire width of the user's browser window. If I leave the Width property empty, it works perfectly in IE, but in Firefox, all of the columns are super skinny, to the point where it is basically unreadable.

Am I doing something wrong to have it work in IE but not in Firefox? Of course, my preference is for it to have the same behavior in Firefox.

If that's not possible or will not be possible soon, do you have any quick suggestions on how to somehow get the width of the browser window and pass it back to the server to then set the width of the RadScheduler? If the user resized the window, the RadScheduler would not resize until the next postback, but that's at least a step in the right direction.

Thanks,

Don

12 Answers, 1 is accepted

answered on 07 Dec 2007, 01:25 PM

Hi Peter,

OK, that helps to know that it at least should work. With that in mind, I played with it a bit further and found that the issue was caused by having the scheduler inside table that otherwise did not have any other elements or attributes that determined its width. This reproduces the problem in Firefox (works fine in IE):

<td>

<telerik:RadScheduler runat=server ID=rS SelectedView="MonthView" OverflowBehavior="Expand" ReadOnly="True" ShowHeader=false Skin="Default"></telerik:RadScheduler>

</td>

</tr>

</table>

This example obviously don't serve any real purpose, but in our application we have other rows in the table that center some other controls above and below the RadScheduler.

Now that I know this is the case, we can work around it, but I wanted you to know the cause.

Thanks,

Don

answered on 03 Dec 2009, 04:50 PM

Is there a solution to this problem? Don needed a simple 100% width for RadScheduler so removing it from the table or not setting a width on the table worked for him. What if I want to simply put the RadScheduler in a cell with 75% width and in the cell to the right (25%) want to show other information. This works fine in IE, but not Firefox.

This is all I have in my RS declaration:

<telerik:RadScheduler ID="RadScheduler1" runat="server" AllowDelete="False"

AllowEdit="False" AllowInsert="False" DataEndField="MeetingDateImplicitEnd"

DataKeyField="RecordID" DataStartField="MeetingDateImplicit"

DataSubjectField="SubjectName" SelectedView="MonthView" Skin="Office2007"

Height="800px">

</telerik:RadScheduler>

If I take it out of the table and set the width to 75%, it works well, except I still need to add information to 25% of the screen to the right.

answered on 10 Mar 2012, 10:43 PM

Getting similar results and tried your latest, but that did not fix the issue. The RadScheduler should stretch out to fill the full area no matter the size of the browser window but it stops part of the way.

<tr>

<td>

<tr>

<td class="txtSectionHeader">Calendar</td>

<asp:ImageButton ID="NewTimeIt" runat="server" ToolTip="New TimeIt"

ImageUrl="~/Images/NewTimeIt.png" OnClientClick="javascript:OpenNewTimeItInfo(); return false;" /></td>

<asp:ImageButton ID="NewEvent" runat="server" ToolTip="New Event"

ImageUrl="~/Images/NewEvent.png" OnClientClick="javascript:OpenNewEvent(); return false;" /></td>

</tr></table></td>

</tr>

<tr>

<td>

<tr>

<td>

<asp:SqlDataSource ID="SqlDataSource1" runat="server"

ConnectionString="<%$ ConnectionStrings:ePonti %>" SelectCommand="SELECT DISTINCT ....">

<asp:Parameter Name="ResourceID" />

<asp:SessionParameter Name="CompanyID" SessionField="CompanyID" />

<asp:Parameter Name="WOStartDate" />

<asp:Parameter Name="WOEndDate" />

</SelectParameters>

</asp:SqlDataSource>

<asp:HiddenField ID="hdnCompanyID" runat="server" />

<asp:UpdatePanel ID="UP1" runat="server">

<telerik:RadScheduler ID="RadScheduler1" runat="server" EditFormDateFormat="MM/dd/yyyy" DataDescriptionField="ToolTip"

DataEndField="TaskEndDate" DataKeyField="ID" DataSourceID="SqlDataSource1" DataStartField="TaskStartDate"

DataSubjectField="Subject" OverflowBehavior="Expand" Localization-HeaderMultiDay="Work Week"

OnNavigationComplete="RadScheduler1_NavigationComplete" Skin="Windows7" Height="500px" Width="1000"

OnClientRecurrenceActionDialogShowing="OnClientRecurrenceActionDialogShowing">

</telerik:RadScheduler></ContentTemplate></asp:UpdatePanel></td>

<asp:CheckBoxList Height="40px" CssClass="gridAltFieldsInView" BorderColor="Black" BorderWidth="0px" ID="chkResourceList"

runat="server" AutoPostBack="True" CellPadding="0" CellSpacing="5" RepeatColumns="1"></asp:CheckBoxList></div></td>

</tr></table></td>

</tr>

</table>

answered on 13 Mar 2012, 03:25 PM

TelerikCalendar.png

Peter,

This did not solve the issue, attached is a screen shot that will help illustrate.

Note: utilizing Telerik.Web.UI v2011.1.413.40

Thanks,

Bill

answered on 13 Mar 2012, 04:50 PM

Peter,

Tried that before and did the modifications again to test - setting both Width & AdvancedForm-Width:

<telerik:RadScheduler ID="RadScheduler1" runat="server" EditFormDateFormat="MM/dd/yyyy" DataDescriptionField="ToolTip"

DataEndField="TaskEndDate" DataKeyField="ID" DataSourceID="SqlDataSource1" DataStartField="TaskStartDate"

DataSubjectField="Subject" OverflowBehavior="Expand" Localization-HeaderMultiDay="Work Week"

OnNavigationComplete="RadScheduler1_NavigationComplete" Skin="Windows7" Height="500px" Width="100%"

OnClientRecurrenceActionDialogShowing="OnClientRecurrenceActionDialogShowing" AdvancedForm-Width="100%">

</telerik:RadScheduler>

Best,

Bill