Axel GALLIOT
Axel GALLIOT

Reputation: 177

Reloading a Kendo UI scheduler

Hello,
I have two different scheduler to display one after the other.
In a js file I have this function :

function doRafraichirInterface() {
    if (b_FENETRE_OUVERTE) {
        return;
    }
    if (flag == false){
        flag = true;
        console.log(flag);
    }
    else{
        flag = false;
        console.log(flag);
    }
    // Rafraichissement du planning
    $("#scheduler").data("kendoScheduler").dataSource.read();
    $("#scheduler").data("kendoScheduler").refresh();

}

This function is called every 15 seconds.

And in a .aspx file, I use a Kendo UI Schedule :

var myView = kendo.ui.MultiDayView.extend({    
            options: {
                selectedDateFormat: "{0:D} - {1:D}"
            },
            name: "Un jour",


            calculateDateRange: function() {
                //create a range of dates to be shown within the view
                var ladate = new Date();
                var Today = ladate.getDay();  
                var year = ladate.getFullYear();
                var month = ladate.getMonth();
                var day = ladate.getDate();

                var selectedDate = this.options.date,                       
                    idx, length,
                    dates = [];

                if (flag == false)
                dates.push(new Date(year, month, day));
                else{
                    if (Today == 1)
                    {
                        var start = kendo.date.dayOfWeek(selectedDate, Today - 2, -1);
                    }
                    else
                    {
                        var start = kendo.date.dayOfWeek(selectedDate, Today - 1, -1);
                    }

                    for (idx = 0, length = 8; idx < length; idx++) {
                        if (start.getDay() != 0) {
                            dates.push(start);
                        }
                        start = kendo.date.nextDay(start);
                    }
                }
                this._render(dates);    
            }
        });

How can I reload the scheduler to change the view ?
Thanks by advance for your answers and sorry for my bad english and the french name of my functions and comments.

EDIT : I've seen a "scheduler.view" method that could allow me to switch between my two views. So I split my in two function like this :

            var oneDayView = kendo.ui.MultiDayView.extend({    
            options: {
                selectedDateFormat: "{0:D} - {1:D}"
            },
            name: "Un jour",


            calculateDateRange: function() {
                //create a range of dates to be shown within the view
                var ladate = new Date();
                var year = ladate.getFullYear();
                var month = ladate.getMonth();
                var day = ladate.getDate();

                var selectedDate = this.options.date,                       
                    idx, length,
                    dates = [];

                dates.push(new Date(year, month, day));

                this._render(dates);    
            }
        });

        var oneWeekView = kendo.ui.MultiDayView.extend({    
            options: {
                selectedDateFormat: "{0:D} - {1:D}"
            },
            name: "Une semaine",


            calculateDateRange: function() {
                //create a range of dates to be shown within the view
                var ladate = new Date();
                var Today = ladate.getDay();  

                var selectedDate = this.options.date,                       
                    idx, length,
                    dates = [];


                    if (Today == 1)
                    {
                        var start = kendo.date.dayOfWeek(selectedDate, Today - 2, -1);
                    }
                    else
                    {
                        var start = kendo.date.dayOfWeek(selectedDate, Today - 1, -1);
                    }

                    for (idx = 0, length = 8; idx < length; idx++) {
                        if (start.getDay() != 0) {
                            dates.push(start);
                        }
                        start = kendo.date.nextDay(start);
                    }
                this._render(dates);    
            }
        });

And changed the "doRafraichirInterface" to this :

    function doRafraichirInterface() {
    if (b_FENETRE_OUVERTE) {
        return;
    }
    if (flag == true){
        console.log(flag);
        flag=false;
        $("#scheduler").data("kendoScheduler").view("oneDayView");

    }
    else{
        console.log(flag);
        flag=true;
        $("#scheduler").data("kendoScheduler").view("oneWeekView");

    }

    // Rafraichissement du planning
    $("#scheduler").data("kendoScheduler").dataSource.read();
    $("#scheduler").data("kendoScheduler").refresh();

}

But my views don't switch, Any ideas ?

EDIT2 : I tried to switch between "day" and "week" with the method I describe higher and it's working. The new question is : how can I switch between two CustomView ?

Upvotes: 1

Views: 1191

Answers (1)

Axel GALLIOT
Axel GALLIOT

Reputation: 177

I finally found out why it didn't work. I post the answer if someone have the same problem later.
A parameter was missing in my declaration of the scheduler.

<%=Html.Kendo()
       .Scheduler<IntranetMVC.Models.Planification>()
       .Name("scheduler")  
       .Date(DateTime.Now)
       .Height(737) 
       .AllDaySlot(false)
       .StartTime(new DateTime(2000, 1, 1, 0, 0, 0))
       .EndTime(new DateTime(2099, 12, 31, 23, 55, 55))
       .ShowWorkHours(true)
       .WorkDayStart(new DateTime(2000,1, 1, 7, 0, 0))
       .WorkDayEnd(new DateTime(2099,12, 31, 18, 0, 0))          
// Configuration des vues disponibles          
       .Views(views=>
       {
       views.CustomView("oneDayView");//Don't forget to put every
       views.CustomView("oneWeekView");// views that you need to switch to.
       })

In the hope that it will help someone, someday !

Upvotes: 0

Related Questions