Joan Gerard
Joan Gerard

Reputation: 125

Is there a way to disable a specific event in kendo ui scheduler?

I am working with Kendo UI, js and the scheduler component.

My question is, if there is a way to disable a specific event from scheduler.

I find this, but this disables all events in scheduler. I want to disable just a specific event. The code should be something like this>

function disableEvents()
{
    var data = $("#scheduler").data("kendoScheduler").dataSource.data();
    data.forEach(function(event){
          if(event.ID='2') 
          {
               event.disable = true; //I have tried with event.editable = true;
          }
    });
}

I can't find the property editable nor disable, or something like that. Maybe there is a way to disable it using jquery. Can anybody help me?

Thank you!

Upvotes: 2

Views: 5905

Answers (2)

D_Learning
D_Learning

Reputation: 1023

You will need to implement all the events specified in the restriction example of Kendo and preventDefault behaviour where ever your condition is not successfully.

For reference: Kendo Restriction Events Description.

You will need to take care of all the events (i.e. edit, save, resize, move) if you want to disable any event from any changes. The events are as below:

    resize: function(e) {
        if (e.event.meetingID = 1) {
            this.wrapper.find(".k-marquee-color").addClass("invalid-slot");
            e.preventDefault();
        }
    },
    move: function(e) {
        if (e.event.meetingId = 1) {
            this.wrapper.find(".k-event-drag-hint").addClass("invalid-slot");
        }
    },
    save: function(e) {
        if (e.event.meetinID = 1) {
            e.preventDefault();
        }
    },
   edit: function (e) {
        if (e.event.meetinID = 1) {
            e.preventDefault();
        }
    }

I have updated the Kendo Restriction example with your condition: Demo

Upvotes: 3

Lars Höppner
Lars Höppner

Reputation: 18402

Use the event event's preventDefault method:

$("#scheduler").kendoScheduler({
    date: new Date("2013/6/6"),
    views: ["day", "month"],
    dataSource: [{
        id: 1,
        start: new Date("2013/6/6 08:00 AM"),
        end: new Date("2013/6/6 09:00 AM"),
        title: "Interview editable"
    }, {
        id: 2,
        start: new Date("2013/6/6 06:00 AM"),
        end: new Date("2013/6/6 07:00 AM"),
        title: "Interview not editable"
    }],
    edit: function (e) {
        if (e.event.id === 2) {
            e.preventDefault();
        }
    }
});

(demo)

Upvotes: 2

Related Questions