pratyushmittal / angular-dragtable Goto Github PK

The original dragtable you reference contains the below header in the Javascript. This project has no license header. It is unclear whether your code is a direct modification of the other code, or whether it is an independent implementation.

1. Is your code also licensed under the MIT license?
2. Is your code a modification of the original dragtable? If so, shouldn't the original license header be included?
3. Can you add a license header to the javascript file?

/**

• @license
• dragtable v1.0
• June 26, 2008
• Dan Vanderkam, http://danvk.org/dragtable/

•            http://code.google.com/p/dragtable/
  
• This is code was based on:
• • Stuart Langridge's SortTable (kryogenix.org/code/browser/sorttable)
• • Mike Hall's draggable class (http://www.brainjar.com/dhtml/drag/)
• • A discussion of permuting table columns on comp.lang.javascript

• Licensed under the MIT license.
  *
• Here's the notice from Mike Hall's draggable script:
  *
• Do not remove this notice.
  *
• Copyright 2001 by Mike Hall.
• See http://www.brainjar.com for terms of use.
  */

When there is pagination then this plugin is not working.
To produce the bug:

1. Change column position by dragging
2. Go to the another page using pagination
3. Column header will stay as it is as you dragged but the column content will move to its original position

I can't seem to get draggable columns if the columns are generated by an ng-repeat. It works fine otherwise. Can you tell me if I'm doing something wrong here? Also, is it possible to do drag handles?

<table class="table table-bordered" draggable>
  <thead>
    <tr>
      <th ng-repeat="column in record.columns">{{column.name}}</th>
    </tr>
  </thead>

  <tbody>
    <tr ng-repeat="i in $times(record.rows)">
      <td ng-repeat="column in record.columns" ng-tap="translateOpen(column.rows, i)">{{column.rows[i]}}</td>
    </tr>
  </tbody>
</table>

best thing would be to bind a scope variable to the directive

e.g. with a sub directive for first columns (e.g. headers [th]):

<script>
function Controller($scope) {
  $scope.tableColumnOrder = {
    idColumn: 1,
    nameColumn: 2
  };
}
</script>

<table draggable="tableColumnOrder">
  <tr>
    <th dragable-column="idColumn">Id</th>
    <th dragable-column="nameColumn">name</th>
  </tr>
</table>

the result would be:

<table draggable="tableColumnOrder">
  <tr>
    <th dragable-column="nameColumn">name</th>
    <th dragable-column="idColumn">Id</th>
  </tr>
</table>

and on drag end (or on change...whatever) you would change the scope variable.