TimeLineView always from 08:00 - 20:00

5 posts, 0 answers
  1. Datamex
    Datamex avatar
    161 posts
    Member since:
    Jun 2012

    Posted 20 Oct 2009 Link to this post

    Dear Telerik,

    Would it be possible to realize the following: I want the timelineview to start at 08:00 and show 24 slots of half an hour (0:30:00). When I click the arrow to go to the next day, the TimeLineView now just shows me the next 24 slots of half an hour, but I just want it to show the next day, starting from 08:00 again... Would this be possible?
  2. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 20 Oct 2009 Link to this post

    Hello,

    Try setting the properties under TimelineView as shown below and see whether it is working as you expected.

    aspx:
     
    <telerik:RadScheduler ID="RadScheduler1" runat="server" DataEndField="End" DataKeyField="ID" 
        DataRecurrenceField="RecurrenceRule" DataRecurrenceParentKeyField="RecurrenceParentID" 
        DataSourceID="SqlDataSource2" DataStartField="Start" DataSubjectField="Subject"
        <TimelineView NumberOfSlots="48" ColumnHeaderDateFormat="t"  
            SlotDuration="00:30:00" StartTime="08:00:00" /> 
    </telerik:RadScheduler> 

    -Shinu.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Datamex
    Datamex avatar
    161 posts
    Member since:
    Jun 2012

    Posted 20 Oct 2009 Link to this post

    No, it doesn't. Now it also shows me the next 48 slots of half an hour when I click on the arrow to the right. I want the TimeLine just to skip to the next day.

    Example:
    I show 20-10-2009 08:00 - 20:00 in the timelineview, I click on the next arrow and I just want to show 21-10-2009 08:00 - 20:00.


  5. Yana
    Admin
    Yana avatar
    4554 posts

    Posted 23 Oct 2009 Link to this post

    Hi Datamex,

    You should subscribe to OnNavigationCommand event and add one day to the SelectedDate property of the scheduler in order to navigate to the next day like this:

    protected void RadScheduler1_NavigationCommand(object sender, SchedulerNavigationCommandEventArgs e)
    {
        if (e.Command == SchedulerNavigationCommand.NavigateToNextPeriod)
        {
            RadScheduler1.SelectedDate = rsAgenda.SelectedDate.AddDays(1);
            e.Cancel = true;
        }
    }

    the timelineview settings should be like this:

    <TimelineView NumberOfSlots="25" ColumnHeaderDateFormat="t" 
                SlotDuration="00:30:00" StartTime="08:00:00"  />

    Kind regards,
    Yana
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  6. Datamex
    Datamex avatar
    161 posts
    Member since:
    Jun 2012

    Posted 23 Oct 2009 Link to this post

    Would it be possible to do this client-side by using the OnClientNavigationCommand event? And how?

    -edit-

    No matter, fixed it! Here's the code to do it!

    function NavigationCommand(sender, args) { 
          if (args.get_command() == Telerik.Web.UI.SchedulerNavigationCommand.NavigateToNextPeriod) { 
            var scheduler = $find('<%=RadScheduler.ClientID %>'); 
            scheduler.set_selectedDate(Date.DateAdd("d", 1, scheduler.get_selectedDate())); 
            args.set_cancel(true);       
          } 
     
          if (args.get_command() == Telerik.Web.UI.SchedulerNavigationCommand.NavigateToPreviousPeriod) { 
            var scheduler = $find('<%=RadScheduler.ClientID %>'); 
            scheduler.set_selectedDate(Date.DateAdd("d", -1, scheduler.get_selectedDate())); 
            args.set_cancel(true); 
          } 
        } 
     
        Date.IsDate = function(p_Expression) { 
          return !isNaN(new Date(p_Expression));    // <-- review further 
        } 
     
        Date.CDate = function(p_Date) { 
          if (Date.IsDate(p_Date)) { return new Date(p_Date); } 
     
          var strTry = p_Date.replace(/\-/g, '/').replace(/\./g, '/').replace(/ /g, '/'); // fix separators 
          strTrystrTry = strTry.replace(/pm$/i, " pm").replace(/am$/i, " am"); // and meridian spacing 
          if (Date.IsDate(strTry)) { return new Date(strTry); } 
     
          var strTrystrTryYear = strTry + '/' + new Date().getFullYear(); // append year 
          if (Date.IsDate(strTryYear)) { return new Date(strTryYear); } 
     
     
          if (strTry.indexOf(":")) {    // if appears to have time 
            var strTrystrTryYear2 = strTry.replace(/ /, '/' + new Date().getFullYear() + ' '); // insert year 
            if (Date.IsDate(strTryYear2)) { return new Date(strTryYear2); } 
     
            var strTryDate = new Date().toDateString() + ' ' + p_Date; // pre-pend current date 
            if (Date.IsDate(strTryDate)) { return new Date(strTryDate); } 
          } 
     
          return false; // double as looser IsDate 
          //throw("Error #13 - Type mismatch"); // or is this better?  
        } 
     
     
     
        Date.DateAdd = function(p_Interval, p_Number, p_Date) { 
          if (!Date.CDate(p_Date)) { return "invalid date: '" + p_Date + "'"; } 
          if (isNaN(p_Number)) { return "invalid number: '" + p_Number + "'"; } 
     
          p_Number = new Number(p_Number); 
          var dt = Date.CDate(p_Date); 
     
          switch (p_Interval.toLowerCase()) { 
            case "yyyy": 
              { 
                dt.setFullYear(dt.getFullYear() + p_Number); 
                break; 
              } 
            case "q": 
              { 
                dt.setMonth(dt.getMonth() + (p_Number * 3)); 
                break; 
              } 
            case "m": 
              { 
                dt.setMonth(dt.getMonth() + p_Number); 
                break; 
              } 
            case "y":       // day of year 
            case "d":       // day 
            case "w": 
              {     // weekday 
                dt.setDate(dt.getDate() + p_Number); 
                break; 
              } 
            case "ww": 
              { // week of year 
                dt.setDate(dt.getDate() + (p_Number * 7)); 
                break; 
              } 
            case "h": 
              { 
                dt.setHours(dt.getHours() + p_Number); 
                break; 
              } 
            case "n": 
              {     // minute 
                dt.setMinutes(dt.getMinutes() + p_Number); 
                break; 
              } 
            case "s": 
              { 
                dt.setSeconds(dt.getSeconds() + p_Number); 
                break; 
              } 
            case "ms": 
              { // JS extension 
                dt.setMilliseconds(dt.getMilliseconds() + p_Number); 
                break; 
              } 
            default: 
              { 
                return "invalid interval: '" + p_Interval + "'"; 
              } 
          } 
          return dt; 
        } 

    -/edit-
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017