Customize Weekview

11 posts, 0 answers
  1. Prava kafle
    Prava kafle avatar
    217 posts
    Member since:
    Apr 2010

    Posted 23 Jun 2011 Link to this post

    Hi,

    I would like to show only one block(one time slot representing whole day) for each resource. week view is grouped vertically  by resource="TechName" . I see time slots representing each hour  and my scheduler occupies larger area in page. If I could display only one time-slot which represents 24 hours and stack all appointments for the day for particular technician, it would give a neat look to my app. Is it  even possible in schedulers week view?


    Thanks,
    Prava
  2. Plamen
    Admin
    Plamen avatar
    2959 posts

    Posted 24 Jun 2011 Link to this post

    Hi Prava kafle,

    I've edited the Resource Grouping demo to achieve the functionality that you wanted. The improvement is shown below highlighted in yellow:
    <telerik:RadScheduler runat="server" ID="RadScheduler1" GroupBy="Room" GroupingDirection="Horizontal"
                    SelectedDate="2007-06-08" DayStartTime="08:00:00" DayEndTime="19:00:00" TimeZoneOffset="03:00:00"
                    DataSourceID="EventsDataSource" DataKeyField="ID" DataSubjectField="Description"
                    DataStartField="Start" DataEndField="End" DataRecurrenceField="RecurrenceRule"
                    DataRecurrenceParentKeyField="RecurrenceParentID" SelectedView="WeekView" FirstDayOfWeek="Monday"
                    LastDayOfWeek="Thursday" RowHeaderWidth="52px"   MinutesPerRow="480"
            RowHeight="250" ShowAllDayRow="false" EnableExactTimeRendering="true">

    You can fix the pixel sizes according to your needs.

    Hope this will help you.

    All the best,
    Plamen Zdravkov
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  3. Prava kafle
    Prava kafle avatar
    217 posts
    Member since:
    Apr 2010

    Posted 24 Jun 2011 Link to this post

    Hi Plamen,
    My application isnot bound to one view, it  lets user toggle between Timeline/Week/Day and Month View.  In Timeline and day view I want users to see 8/24 timeslots  under each  resource but in Weekview I want only one time slot as I see in my Month view. IS it possible to add/disable a property in markup  to achieve this? I have attached  an image  of Scheduler in MonthView.

      <telerik:RadScheduler ID="rsTicketsSchedule" runat="server" AllowInsert="False"   DisplayDeleteConfirmation="False"  Localization-HeaderToday="Today"
    ..........................................................
    ........................
    ..........................>
      <DayView UserSelectable="True"       GroupBy ="TechName"    GroupingDirection="Horizontal"  />
                                                                <WeekView UserSelectable="True"      GroupBy ="TechName"    GroupingDirection="Vertical"   />
                                                                <MonthView UserSelectable="True"     GroupBy ="TechName"    GroupingDirection="Vertical"/>
                                                            <timelineview columnheaderdateformat="h:mm tt"  groupingdirection="Vertical" headerdateformat="MM/dd/yyyy h:mm tt"
                                                               numberofslots="21" slotduration="00:30:00" starttime="08:00:00" />

    ........

    ....
      </telerik:RadScheduler> 



    Thanks,
    Prava



     
  4. Prava kafle
    Prava kafle avatar
    217 posts
    Member since:
    Apr 2010

    Posted 24 Jun 2011 Link to this post

    Hi ,

    I checked your demo(http://demos.telerik.com/aspnet-ajax/scheduler/examples/resourceheadertemplates/defaultcs.aspx
    )  but  it still doesn't fulfill my objective. What I am trying to do is shown in attachment.

    Thanks,
    Prava
  5. Plamen
    Admin
    Plamen avatar
    2959 posts

    Posted 28 Jun 2011 Link to this post

    Hello Prava kafle,

    If you want to set the desired properties only to the Week view you can achieve this by setting them in the NavigationCommand event and the Page_Load event like this:
    private void Page_Load(object sender, EventArgs e)
           {
     
               if (RadScheduler1.SelectedView == SchedulerViewType.WeekView)
               {
                   RadScheduler1.ShowAllDayRow = false;
                   RadScheduler1.EnableExactTimeRendering = true;
                   RadScheduler1.RowHeight = 250;
                   RadScheduler1.MinutesPerRow = 480;
               }
           }
           protected void RadScheduler1_NavigationCommand(object sender, SchedulerNavigationCommandEventArgs e)
           {
               if (e.Command == SchedulerNavigationCommand.SwitchToWeekView)
               {
                   RadScheduler1.ShowAllDayRow = false;
                   RadScheduler1.EnableExactTimeRendering = true;
                   RadScheduler1.RowHeight = 250;
                   RadScheduler1.MinutesPerRow = 480;
               }
               else if (e.Command == SchedulerNavigationCommand.NavigateToPreviousPeriod || e.Command == SchedulerNavigationCommand.NavigateToNextPeriod)
               {
                   if (RadScheduler1.SelectedView == SchedulerViewType.WeekView)
                   {
                       RadScheduler1.ShowAllDayRow = false;
                       RadScheduler1.EnableExactTimeRendering = true;
                       RadScheduler1.RowHeight = 250;
                       RadScheduler1.MinutesPerRow = 480;
                   }
               }
               else
               {
                   RadScheduler1.ShowAllDayRow = true;
                   RadScheduler1.EnableExactTimeRendering = false;
                   RadScheduler1.RowHeight = 25;
                   RadScheduler1.MinutesPerRow = 30;
               }
           }
     
    Best wishes,
    Plamen Zdravkov
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  6. Prava kafle
    Prava kafle avatar
    217 posts
    Member since:
    Apr 2010

    Posted 28 Jun 2011 Link to this post

    Hi,
    I implemented your code and I still see two time slots for single day under each group.

    On Pageload I modified your code to  cover 24 hour period by single timeslot:

                if (TicketsSchedule.SelectedView == SchedulerViewType.WeekView)
                {
                    TicketsSchedule.ShowAllDayRow = false;
                    TicketsSchedule.EnableExactTimeRendering = true;
                    TicketsSchedule.RowHeight = 100;
                    TicketsSchedule.MinutesPerRow = 1440;
                    TicketsSchedule.ShowFullTime = true;
                   
                }

    On Markup I have

     <DayView UserSelectable="True"       GroupBy ="TechName"    GroupingDirection="Horizontal"  />
       <WeekView UserSelectable="True"      GroupBy ="TechName"    GroupingDirection="Vertical"  ShowHoursColumn="false"   />
        <MonthView UserSelectable="True"     GroupBy ="TechName"    GroupingDirection="Vertical"/>
        <timelineview columnheaderdateformat="h:mm tt"  groupingdirection="Vertical" headerdateformat="MM/dd/yyyy h:mm tt"  numberofslots="21" slotduration="00:30:00" starttime="08:00:00" />
                                                         

  7. Plamen
    Admin
    Plamen avatar
    2959 posts

    Posted 29 Jun 2011 Link to this post

    Hello Prava kafle,

    It seems this it is a css problem. Here is the code that should fix it:

    <style type="text/css">
       .rsAlt
       {
           height:0px !important;
           }
        .rsNonWorkHour:hover
         {
            background:red !important;
            }
           
       </style>

    The second rule is because sometimes on hover you have different css for different part of the day and we have to override it.
     
    Regards,
    Plamen Zdravkov
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  8. Prava kafle
    Prava kafle avatar
    217 posts
    Member since:
    Apr 2010

    Posted 29 Jun 2011 Link to this post

    It did not help, week view still renders with two timeslots for each day and each group.
  9. Plamen
    Admin
    Plamen avatar
    2959 posts

    Posted 30 Jun 2011 Link to this post

    Hi Prava,

    I am sending you a simple  demo project where I was testing your issue and everything looks fine with one slot per row.

    Please have a look at the code and if you have further questions don't hastate to ask.

    Greetings,
    Plamen Zdravkov
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  10. Prava kafle
    Prava kafle avatar
    217 posts
    Member since:
    Apr 2010

    Posted 30 Jun 2011 Link to this post

    Hi Plamen,
    Thank you very much for the sample code and helping me solve this issue. In your sample code  on Dayview each timeslot has two rows and when you hover only one block gets highlighted. How can I show only one block for each time slot/ highlight both on hover.

    I want  my day view to look and behave as in this link
     http://demos.telerik.com/aspnet-ajax/scheduler/examples/reminders/defaultcs.aspx

    Thanks,
    Prava
  11. Plamen
    Admin
    Plamen avatar
    2959 posts

    Posted 04 Jul 2011 Link to this post

    Hi Prava,

    We can set the changed css only to the Week-View like that:
    <style type="text/css">
       .rsWeekView .rsAlt
       {
           height:0px !important;
        }
           .rsWeekView .rsNonWorkHour:hover
           {
               background:red !important;
         }
       </style>

    All the best,
    Plamen Zdravkov
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

Back to Top