title: Dragging a table column using HTML5 and AngularJS
body: <p><a href="http://jsfiddle.net/asutosh/82qum/" rel="nofollow">http://jsfiddle.net/asutosh/82qum/</a></p>
  
  <pre><code>&lt;div ng-app='myApp'&gt;
  
   &lt;div ng-controller="myCtrl"&gt;
  
  
  &lt;table border="4"&gt;
      &lt;thead&gt;
          &lt;th ng-repeat="hd in heads"&gt;
              &lt;div draganddrop drag="handleDrag()"&gt;{{hd}}&lt;/div&gt;
          &lt;/th&gt;
          &lt;/thead&gt;
          &lt;tr ng-repeat="row in myData"&gt;
          &lt;td ng-repeat="hd in heads"&gt;
          {{row[hd]}}
          &lt;/td&gt;
          &lt;/tr&gt;
  
  &lt;/table&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p>Here is the JS:</p>
  
  <pre><code>  var myApp=angular.module('myApp',[]);
    myApp.controller('myCtrl',function($scope){
    $scope.handleDrag=function()
       {
  
       }
  
  
     $scope.heads=['name','age','company','tech'];
  
     $scope.myData=[{name:'Jay',age:27,company:'XYZ',tech:'Js'},
              { name:'Rayn',age:30,company:'XYZ',tech:'.net'}]    
     });
      myApp.directive('draganddrop',function(){
      return{
      scope:{
          drag:'&amp;'
      },  
      link: function(scope, element) {
      // this gives us the native JS object
      var el = element[0];
       el.draggable=true;
  
      el.addEventListener(
          'dragstart',
          function(e) {
  
  
      e.dataTransfer.effectAllowed = 'move';
  
             // this.classList.add('drag');
              return false;
          },
          false
      );
  
      el.addEventListener(
          'dragend',
          function(e) {
  
              this.classList.remove('drag');
              return false;
          },
          false
      );
  }   
  };
  
  });
  </code></pre>
  
  <p>In the above fiddle I want to create a table having column reordering, I am able to set the column header to draggable however while dragging only the header's image is getting dragged, I want the the image of the whole column should come as the dragging image, any suggestion on that will be helpful.</p>