Enable and Disable Dragging at Runtime
Your project might require you to enable or disable the Kendo UI Drag-and-Drop functionality during runtime.
To achieve this behavior:
- Initialize the Drag-and-Drop feature on the parent container.
- Use a filter to specify which items will be draggable.
- Change the class of the items to enable and disable them.
The following example demonstrates how to accomplish this scenario.
Example
<button id="btn">Enable/Disable</button>
<div id="parent">
<div class="draggable">Foo</div>
<div class="draggable">Bar</div>
</div>
<script>
$("#parent").kendoDraggable({
filter: ".draggable:not(.disabled)",
hint: function(element) { return element.clone(); }
});
$("#btn").click(function() {
$("#parent").children().toggleClass("disabled");
});
</script>