How to make some tasks uneditable and others editable

[Shobhit]

I need to make some of the task in a Gantt Chart uneditable ( non draggable) while allowing others to be edited (can be dragged). Please help

[Bozhidar]

Hello,

You can use the moveStart event and call e.preventDefault() to prevent a certain task from moving.

Regards,
Bozhidar
Telerik

 

 

[Shobhit]

Thank you very much.

Just one more question, similar to above, I need to make some of the tasks appear in the treelist view inside Gantt chart to be unsortable while others sortable.

[Shobhit]

By unsortable  I mean to say they can or cannot be reordered by dragging and droping

[Bozhidar]

Hi,

Unfortunately there isn't an event that's triggered on this action yet, so implementing this will require some coding. Here's the code you need to add to your page in order to achieve this:

var gantt = $("#gantt").data("kendoGantt");
var selector = ".k-treelist .k-grid-content table td";
$(gantt.wrapper)
    .on("mousedown", selector, function(e) {
        if ($(this).parent().attr("data-level") === "2") { // Prevent drag and drop of level 3 tasks (zero based indexing)
            $(gantt.wrapper).on("mousemove.preventDrag", selector, function(e) {
                e.stopPropagation();
            })
        }
    })
    .on("mouseup", selector, function() {
        $(gantt.wrapper).off(".preventDrag");
    });

Regards,
Bozhidar
Telerik

 

 

[Shobhit]

thank you so much,

One more thing, how to avoid dropping of rows with data-level="0" to become the child of data-level="0" or further, so that the items with level 0 will always remain the same.

 

[Bozhidar]

Hello,

For this you can use the save event and check the corresponding fields.

Regards,
Bozhidar
Telerik

 

 

[Shobhit]

Thank you so much for the help,

One last question, can we change the icon "+" "-" "cross" that appears during the dragging.

Also the logic based on which these icon change

[Bozhidar]

Hello,

The Icon is changed based on the position of the task relative to the tasks underneath it. It's controlled by a class name, which changes between the following values, which are self-explanatory:

"k-insert-top",
"k-insert-bottom",
"k-add",
"k-insert-middle",
"k-denied",

For instance the k-insert-top class is set to the icon when the task is to be added above another task.

To change the icon just use CSS and the above classes to set the background-image to your own icon.

Regards,
Bozhidar
Telerik