First Look Demo - Calendar 2 Selected Date

4 posts, 0 answers
  1. Tim
    Tim avatar
    39 posts
    Member since:
    Oct 2010

    Posted 07 Mar 2012 Link to this post

    Hi, I've built a scheduler very simlar to the first look demo and I'm having a problem setting the scheduler date to the date selected on the second calendar. The same behavior happens on the first look demo schedule. If you select a date on the second calendar the schedule displays the prior month. I'm using the same javascript as the demo. The date passed to the schedule is the correct date, but the scheduler doesn't seem to use it. If you select a date on the first calendar it works ok.

    Thanks, all help is appreciated.
  2. Richard
    Richard avatar
    479 posts
    Member since:
    Nov 2011

    Posted 09 Mar 2012 Link to this post

    Tim:

    In looking over the code from the Scheduler/First Look Demo, it functions as intended

    The reason that the second calender instance does not navigate the Scheduler to the month which contains its newly selected date is due to the recursive call that it makes to calender one in this method:

    function OnCalendar2DateSelected(sender, args) {
     
        var selectedDateTriplet = sender.get_selectedDates()[0];
     
        if (selectedDateTriplet) {
     
            var selectedDate = new Date(selectedDateTriplet[0], selectedDateTriplet[1] - 1, selectedDateTriplet[2]);
            scheduler.set_selectedDate(selectedDate);
     
            // The following lines kick off 'OnCalendar1ViewChanged' event and this resets Scheduler to the month
           // selected in calender two.
            var previousMonthTriplet = [selectedDateTriplet[0], selectedDateTriplet[1] - 1, selectedDateTriplet[2]];
            calendar1.navigateToDate(previousMonthTriplet);
        }
    }
     
    function OnCalendar1ViewChanged(sender, eventArgs) {
     
        var dateTriplet = sender.get_focusedDate();
     
        var selectedDate = new Date(dateTriplet[0], dateTriplet[1] - 1, dateTriplet[2]);
        scheduler.set_selectedDate(selectedDate);
     
        calendar2._navigate(eventArgs.get_step());
    }

    Using this code, as written, will always reset the Scheduler to the month selected in Calender one. You'd have to rewrite the JavaScript to your own specifications to avoid this.

    Regards,
  3. Tim
    Tim avatar
    39 posts
    Member since:
    Oct 2010

    Posted 09 Mar 2012 Link to this post

    Thanks for the reply. I suspected it was a recursive call. Any ideas on how to get the second calendar to go to the selected date. The main purpose of the calendars on the left side is to select a date and display that date on the calendar.
  4. Ivana
    Admin
    Ivana avatar
    657 posts

    Posted 13 Mar 2012 Link to this post

    Hi Tim,

    Here is what you can do to make RadScheduler navigate to the second RadCalendar's selected date.
    Just comment the highlighted code lines from the JavaScript code of the online demo:
    function OnCalendar2DateSelected(sender, args) {
        var selectedDateTriplet = sender.get_selectedDates()[0];
     
        if (selectedDateTriplet) {
     
            var selectedDate = new Date(selectedDateTriplet[0], selectedDateTriplet[1] - 1, selectedDateTriplet[2]);
            scheduler.set_selectedDate(selectedDate);
             
            //var previousMonthTriplet = [selectedDateTriplet[0], selectedDateTriplet[1] - 1, selectedDateTriplet[2]];
            //calendar1.navigateToDate(previousMonthTriplet);
        }
    }
     
    function OnCalendar1ViewChanged(sender, eventArgs) {
        //var dateTriplet = sender.get_focusedDate();
     
        //var selectedDate = new Date(dateTriplet[0], dateTriplet[1] - 1, dateTriplet[2]);
        //scheduler.set_selectedDate(selectedDate);
        calendar2._navigate(eventArgs.get_step());
    Ivana
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top