Edit this page

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: 1. Initialize the Drag-and-Drop feature on the parent container. 1. Use a filter to specify which items will be draggable. 1. 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>

See Also

Is this article helpful? Yes / No
Thank you for your feedback!

Give article feedback

Tell us how we can improve the information

close
Dummy