SebLours/index.html

## index.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Drag &amp; Drop table rows</title>

    <script src="https://code.angularjs.org/1.5.8/angular.min.js"></script>
    <script src="https://raw.githubusercontent.com/a5hik/ng-sortable/master/dist/ng-sortable.min.js"></script>

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

    <style type="text/css">
        .as-sortable-item, .as-sortable-placeholder {
            display: block;
        }

        table .as-sortable-item, table .as-sortable-placeholder {
            display: table-row;
        }

        .as-sortable-item {
            -ms-touch-action: none;
            touch-action: none;
            /* to disable context menu on iOS devices */
            -webkit-touch-callout: none;
        }

        .as-sortable-item-handle {
            cursor: move;
            cursor: -webkit-grab;
            cursor: -moz-grab;
        }

        .as-sortable-placeholder {
            background: #eee;
        }

        .as-sortable-drag {
            position: absolute;
            pointer-events: none;
            z-index: 9999;
        }

        .as-sortable-hidden, .as-sortable-dragging {
            display: none !important;
        }

        .as-sortable-un-selectable {
            -webkit-touch-callout: none;
            -webkit-user-select: none;
            -khtml-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
        }
    </style>

    <script type="text/javascript">
        var demo = angular.module('demo', ['as.sortable']);

        demo.controller('ListController',['$scope', '$document', function ListController($scope, $document) {
            $scope.items = [
                {
                  sku: 'AG-2596845-47',
                  created_at: Date.now(),
                  price: 1254.25
                }, {
                  sku: 'BC-121212-47',
                  created_at: Date.now(),
                  price: 124.25
                }, {
                  sku: 'ZG-2596845-47',
                  created_at: Date.now(),
                  price: 1254.25
                }
            ];

            $scope.sortableOptions = {
                containment: '#items',
                placeholder: function (itemScope) {
                    var tr = itemScope.element[0];
                    var placeholder = $document[0].createElement("tr");
                    placeholder.style.display = 'table-row';

                    for (var i = 0; tr.cells[i]; i++) {
                        var cell = placeholder.insertCell(i);
                        cell.innerHTML = tr.cells[i].innerHTML;
                    }

                    return placeholder;
                }
            };
        }]);
    </script>
</head>
<body ng-app="demo">
    <div class="container">
        <h1>Sortable table rows (anuglar + ng-sortable)</h1>
        <div ng-view>
            <div ng-controller="ListController">
                <table class="table" id="items">
                    <thead>
                        <tr>
                            <th>SKU</th>
                            <th>Created at</th>
                            <th>At</th>
                        </tr>
                    </thead>
                    <tbody ng-model="items" as-sortable="sortableOptions">
                        <tr ng-repeat="item in items" as-sortable-item>
                            <td as-sortable-item-handle>{{ item.sku }}</td>
                            <td as-sortable-item-handle>{{ item.created_at|date:'medium' }}</td>
                            <td as-sortable-item-handle>{{ item.price|currency }}</td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</body>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<title>Drag & Drop table rows</title>

	<script src="https://code.angularjs.org/1.5.8/angular.min.js"></script>
	<script src="https://raw.githubusercontent.com/a5hik/ng-sortable/master/dist/ng-sortable.min.js"></script>

	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

	<style type="text/css">
	.as-sortable-item, .as-sortable-placeholder {
	display: block;
	}

	table .as-sortable-item, table .as-sortable-placeholder {
	display: table-row;
	}

	.as-sortable-item {
	-ms-touch-action: none;
	touch-action: none;
	/* to disable context menu on iOS devices */
	-webkit-touch-callout: none;
	}

	.as-sortable-item-handle {
	cursor: move;
	cursor: -webkit-grab;
	cursor: -moz-grab;
	}

	.as-sortable-placeholder {
	background: #eee;
	}

	.as-sortable-drag {
	position: absolute;
	pointer-events: none;
	z-index: 9999;
	}

	.as-sortable-hidden, .as-sortable-dragging {
	display: none !important;
	}

	.as-sortable-un-selectable {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	}
	</style>

	<script type="text/javascript">
	var demo = angular.module('demo', ['as.sortable']);

	demo.controller('ListController',['$scope', '$document', function ListController($scope, $document) {
	$scope.items = [
	{
	sku: 'AG-2596845-47',
	created_at: Date.now(),
	price: 1254.25
	}, {
	sku: 'BC-121212-47',
	created_at: Date.now(),
	price: 124.25
	}, {
	sku: 'ZG-2596845-47',
	created_at: Date.now(),
	price: 1254.25
	}
	];

	$scope.sortableOptions = {
	containment: '#items',
	placeholder: function (itemScope) {
	var tr = itemScope.element[0];
	var placeholder = $document[0].createElement("tr");
	placeholder.style.display = 'table-row';

	for (var i = 0; tr.cells[i]; i++) {
	var cell = placeholder.insertCell(i);
	cell.innerHTML = tr.cells[i].innerHTML;
	}

	return placeholder;
	}
	};
	}]);
	</script>
	</head>
	<body ng-app="demo">
	<div class="container">
	<h1>Sortable table rows (anuglar + ng-sortable)</h1>
	<div ng-view>
	<div ng-controller="ListController">
	<table class="table" id="items">
	<thead>
	<tr>
	<th>SKU</th>
	<th>Created at</th>
	<th>At</th>
	</tr>
	</thead>
	<tbody ng-model="items" as-sortable="sortableOptions">
	<tr ng-repeat="item in items" as-sortable-item>
	<td as-sortable-item-handle>{{ item.sku }}</td>
	<td as-sortable-item-handle>{{ item.created_at\|date:'medium' }}</td>
	<td as-sortable-item-handle>{{ item.price\|currency }}</td>
	</tr>
	</tbody>
	</table>
	</div>
	</div>
	</div>
	</body>