New to Kendo UI for jQuery? Download free 30-day trial

Cancel Gantt Task Move If the New Start and End Do Not Pass Server Validation


Product Progress® Kendo UI® Gantt for jQuery


On moving (drag and drop) a Gantt task and based on server validation logic, I want to validate if the new start and end dates are valid.

How can I call the validation an AJAX request and, if the validation fails, to keep the initial start and end date for that task?


Perform a custom check on the server in the moveEnd event of the Gantt. As a result, the default change is prevented and if the validation passes, the new start and end dates are saved for that task.

<div id="gantt"></div>

    dataSource: [
        id: 1,
        orderId: 0,
        parentId: null,
        title: "Task1",
        start: new Date("2014/6/17 9:00"),
        end: new Date("2014/6/17 11:00")
    moveEnd: function(e) {
      var gantt = e.sender;
      var task = e.task;
      var start = e.start;
      var end = e.end;
      $.get("", function(data) {
        var randomNumber = Math.floor(Math.random() * 2) + 1;

        // If validation passes save the updated task
        if (randomNumber === 1) {
          task.set('start', start);
          task.set('end', end);
      }, "jsonp");

See Also

In this article