Search code examples
javascriptkendo-uisignalrkendo-scheduler

How do I update a Kendo scheduler from a SignalR hub method?


Here is the code using signalr, it successfully sends the information to the hub and the hub is just doing a clients.all.Notifiy etc etc..... I've just add the code sample that you recommedend, i doing this from the scheduler_change(e) so that on a single click it will insert the info that is returned from the hub.. for some reason the new booking does not show on the scheduler.

 function scheduler_change(e) {
        var start = e.start; //selection start date
        var end = e.end; //selection end date
        var slots = e.slots; //list of selected slots
        var events = e.events; //list of selected Scheduler events


        var notificationHub = $.connection.MyBookingHub;
        notificationHub.client.Notify = function (MyStart, MyEnd, MyMessage) {

       //     kendoConsole.log(kendo.toString(new Date(MyStart) + " " + new Date(MyEnd) + " " + MyMessage));


            var scheduler = $("#scheduler").data("kendoScheduler", function () {
                scheduler.dataSource.add({
                    start: new Date(MyStart),
                    end: new Date(MyEnd),
                    title: "Costas Interview"
                });
           });

        };


        $.connection.hub.start().done(function () {

            notificationHub.server.sendNotification(start, end, "Booking Title");

        });
    }

Solution

  • You should only create the client.notify method once, not each time the change event on the scheduler widget is triggered. Same goes for starting the connection.

    So it should probably be something like:

    // set up hub methods and start connection ..
    var notificationHub = $.connection.MyBookingHub;
    notificationHub.client.Notify = function (MyStart, MyEnd, MyMessage) {
        var scheduler = $("#scheduler").data("kendoScheduler");
        scheduler.dataSource.add({
            start: new Date(MyStart),
            end: new Date(MyEnd),
            title: "Costas Interview"
        });
    };
    
    window.hubConnection = $.connection.hub.start();
    
    // create scheduler change handler
    function scheduler_change(e) {
        var start = e.start; //selection start date
        var end = e.end; //selection end date
        var slots = e.slots; //list of selected slots
        var events = e.events; //list of selected Scheduler events
    
        window.hubConnection.done(function () {
            notificationHub.server.sendNotification(start, end, "Booking Title");
        });
    }