HTML JavaScript
Switch branches/tags
Nothing to show
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
script
.gitattributes
README.md
index.html

README.md

Angular-Drag-and-Drop Bitdeli Badge

AngularJS directive for drag and drop.This directive can drag and drop in the child level too whatever the depth of the child is.

How to use it

Data List

$scope.data = [
    { name: "Anik Islam", age: 22, gender: "Male" },
    { name: "Mofijul Islam", age: 21, gender: "Male" },
    { name: "Tanveer Islam", age: 24, gender: "Male" },
    { name: "Arifa Akter", age: 22, gender: "Female" },
    { name: "Shayla Islam", age: 22, gender: "Female" }

];

Add drag-drop atrribute in your table

 <tr ng-repeat="user in data" drag-drop>
     <td>{{user.name}}</td>
     <td>{{user.age}}</td>
     <td>{{user.gender}}</td>
  </tr>

This only change data visually.

If you want to change property during drag and drop then bind property names by comma(,) wtih drag-drop attribute

 <tr ng-repeat="user in data" drag-drop="age,gender">
     <td>{{user.name}}</td>
     <td>{{user.age}}</td>
     <td>{{user.gender}}</td>
  </tr>

If you wanna to catch drop event

Declare e function in your controller

$scope.ondrop = function (e) {
        console.log(e);
}

Then bind this function with after-drop attribute

<tr ng-repeat="user in dataWithProperty" drag-drop="{{properties}}" after-drop="ondrop">

Chek Demo here in Plunkr