Skip to content
This repository was archived by the owner on Sep 8, 2020. It is now read-only.
This repository was archived by the owner on Sep 8, 2020. It is now read-only.

ui-sortable + ng-repeat has flaky behavior on drag & drop #29

Closed
@dularion

Description

@dularion

When you use ui-sortable with ng-repeat it does not work properly on drag & drop. The reason for this is that the call to element.sortable(opts); in the bottom of the link-function is triggered BEFORE the elements have rendered as html (this can easily be shown by adding an alert('link') right before or after the call. At that point you can see that the elements from ng-repeat are not there. If you wrap this call in a timeout of 100 (maybe less, but I'll stick to 100) it works, because then the elements are actually on the page.

the following is a demonstration of a sortable List that has actual written html (top) and one that is generated through ng-repeat (bottom).

http://codepen.io/anon/pen/hrwbq

As mentionened above, the fix for this bug would be to implement a timeout when initializing sortable. Also, you will have to put the top part (the whole part of if (ngModel)) in an init function, otherwise they will not work properly.

$timeout(function () {
initSortable();
element.sortable(opts);
}, 100);

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions