1

I have an array of tiles that start off in the following position:

<div gridster>
    <ul>
        <li gridster-item="item" ng-repeat="item in standardItems"></li>
    </ul>
</div>

$scope.standardItems = [
  { sizeX: 2, sizeY: 1, row: 0, col: 0 },
  { sizeX: 2, sizeY: 2, row: 0, col: 2 },
  { sizeX: 1, sizeY: 1, row: 0, col: 4 },
  { sizeX: 1, sizeY: 1, row: 0, col: 5 },
  { sizeX: 2, sizeY: 1, row: 1, col: 0 },
  { sizeX: 1, sizeY: 1, row: 1, col: 4 },
  { sizeX: 1, sizeY: 2, row: 1, col: 5 },
  { sizeX: 1, sizeY: 1, row: 2, col: 0 },
  { sizeX: 2, sizeY: 1, row: 2, col: 1 },
  { sizeX: 1, sizeY: 1, row: 2, col: 3 },
  { sizeX: 1, sizeY: 1, row: 2, col: 4 }
];

As this is a gridster layout, any one "item" can be dragged and dropped to a new located.

Problem: How can I create an array that is ordered by the layout position? So that the topmost left tile is the index 0, and the bottom-most right tile is the last indexed item everytime the layout is reshuffled?

plunkr

Kode_12
  • 4,506
  • 11
  • 47
  • 97
  • This can help you maybe: http://stackoverflow.com/questions/18614695/sort-or-rearrange-rows-of-a-table-in-angularjs-drag-and-drop – foobar443 Jun 01 '16 at 20:05

0 Answers0