I am having some problem with Column reordering in angular-datatable(angular-datatables),
Please have a look at : angular-datatable column draggable out of the table, to better understand the question.
So I could able to find a simple drag-drop/column-reorder directives that does exactly what I wanted.
link: ColumnReordering (This has the neat drag-drop/column-reordering implementation)
So tried to couple with angular-datatable, which you can find it here angular-dataTable Integration
Steps I did with the first plunker to integrate the angular-datatable:
In index.html
< script src="http://code.jquery.com/jquery-1.10.1.min.js" />
< script src="//cdn.datatables.net/1.10.2/js/jquery.dataTables.min.js" />
< script src="http://code.angularjs.org/1.2.11/angular.js" />
< script src="http://l-lin.github.io/angular-datatables/dist/angular-datatables.min.js" />
Added datatables
in the DI
angular.module('myApp', ['datatables'] );
Added datatable="ng"
in tabletemplate.html
<table datatable="ng" class="acttable" border="1">
<thead>
<th style="cursor:move" draggable drag="handleDrag" dragData="{{hd}}" dragImage="{{dragImageId}}" droppable drop="handleDrop" ng-repeat="hd in conf.heads"><span>{{hd}}</span>
</th>
</thead>
<tbody>
<tr ng-repeat="data in conf.myData">
<td ng-repeat="d in conf.heads"><span>{{data[d]}}</span>
</td>
</tr>
</tbody>
</table>
Problem Is column reordering is happening, but there is no datatable
features affecting , Can see errors in web console.
Could not able to figure out the problem.