drag

Fired while dragging. The drag event represents a jQuery mousemove event and contains all the event data of the jQuery Event Object.

Example - bind during the initialization

<div id="draggable"></div>

<script>
  $("#draggable").kendoDraggable({
    hint: function(element) {
      return element.clone();
    },
    drag: function(e) {
/* The result can be observed in the DevTools(F12) console of the browser. */
      console.log("x: ", e.screenX, "y: ", e.screenY);
    }
  });
</script>
<style>
  #draggable {
    width: 50px;
    height: 50px;
    background-color: orange;
    border: 2px solid green;
  }
</style>

Example - hook up to the event via bind method after initialization

<div id="draggable"></div>

<script>
  $("#draggable").kendoDraggable({
    hint: function(element) {
      return element.clone();
    }
  });

  $("#draggable").data("kendoDraggable").bind("drag", function(e) {
/* The result can be observed in the DevTools(F12) console of the browser. */
    console.log("x: ", e.screenX, "y: ", e.screenY);
  });
</script>
<style>
  #draggable {
    width: 50px;
    height: 50px;
    background-color: orange;
    border: 2px solid green;
  }
</style>

Event Data

e.target Element

The draggable element.

e.sender kendo.ui.Draggable

The Draggable instance which fired the event.