CODEWITHSUNDEEP
drag-and-dropkendo-uielement
M6rk
M6rk

Reputation: 159

Kendo UI how to get the id of elements during drop event?

I have the following HTML and would like to get the DOM elements for the elements involved in the drag and drop event. Also, if you could tell me how i might be able to figure this out using debugger, that would be even better!

Here is the code:

<div class="dragArea" id="choice1">proud</div>
<div class="dragArea" id="choice2">strong</div>
<div class="dragArea" id="choice3">merry</div>
<div class="dragArea" id="choice4">friendly</div>
<div class="dropArea k-header" id="gap1">Drop here</div>
<div class="dropArea k-header" id="gap2">Drop here</div>
<div class="dropArea k-header" id="gap3">Drop here</div>
<div class="dropArea k-header" id="gap4">Drop here</div>
 <script>         
     $(".dragArea").kendoDraggable({
         group: "choicesGroup",
         hint: function (element) {
             return element.clone();
         }
     });
     $(".dropArea").kendoDropTarget({ group: "choicesGroup", drop: onDrop });

     function onDrop(e) {
         // How do i get the id of the elements involved in the drag and drop event?

     }
    </script>

Upvotes: 0

Views: 1822

Answers (1)

M6rk
M6rk

Reputation: 159

 function onDrop(e) {
     // Get the id of the elements involved in the drag and drop event
         var source = $(e.draggable.element).attr('id');
         var target = e.dropTarget.attr('id');
 }

Upvotes: 2

Related Questions