search

angular-ui / ui-sortable

jQuery UI Sortable for AngularJS
http://angular-ui.github.io/ui-sortable/
MIT License
1.26k stars 444 forks source link

Nested Issues #136

Closed amcdnl closed 10 years ago

amcdnl commented 10 years ago

When trying to do nested sortables I get a few errors like:

  Error: cannot call methods on sortable prior to initialization; attempted to call method 'option'
at Function.jQuery.extend.error (http://10.211.55.3/phoenix/lib/jquery/jquery-2.1.0.js:248:9)
at HTMLUListElement.<anonymous> (http://10.211.55.3/phoenix/lib/jquery-ui/jquery-ui.js:487:15)
at Function.jQuery.extend.each (http://10.211.55.3/phoenix/lib/jquery/jquery-2.1.0.js:381:23)
at jQuery.fn.jQuery.each (http://10.211.55.3/phoenix/lib/jquery/jquery-2.1.0.js:137:17)
at $.widget.bridge.$.fn.(anonymous function) [as sortable] (http://10.211.55.3/phoenix/lib/jquery-ui/jquery-ui.js:483:9)
at http://10.211.55.3/phoenix/lib/ui-sortable/sortable.js:187:25
at Object.forEach (http://10.211.55.3/phoenix/lib/angular/angular.js:311:20)
at Object.<anonymous> (http://10.211.55.3/phoenix/lib/ui-sortable/sortable.js:177:23)
at Object.$get.Scope.$watch.watcher.fn (http://10.211.55.3/phoenix/lib/angular/angular.js:11642:24)
at Scope.$get.Scope.$digest (http://10.211.55.3/phoenix/lib/angular/angular.js:11898:29)

and 

Error: cannot call methods on sortable prior to initialization; attempted to call method 'refresh'
at Function.jQuery.extend.error (http://10.211.55.3/phoenix/lib/jquery/jquery-2.1.0.js:248:9)
at HTMLUListElement.<anonymous> (http://10.211.55.3/phoenix/lib/jquery-ui/jquery-ui.js:487:15)
at Function.jQuery.extend.each (http://10.211.55.3/phoenix/lib/jquery/jquery-2.1.0.js:381:23)
at jQuery.fn.jQuery.each (http://10.211.55.3/phoenix/lib/jquery/jquery-2.1.0.js:137:17)
at $.widget.bridge.$.fn.(anonymous function) [as sortable] (http://10.211.55.3/phoenix/lib/jquery-ui/jquery-ui.js:483:9)
at http://10.211.55.3/phoenix/lib/ui-sortable/sortable.js:47:25
at http://10.211.55.3/phoenix/lib/angular/angular.js:13677:28
at completeOutstandingRequest (http://10.211.55.3/phoenix/lib/angular/angular.js:4144:10)
at http://10.211.55.3/phoenix/lib/angular/angular.js:4451:7

Code sample can be provided if needed.

thgreasi commented 10 years ago

cannot call methods on sortable prior to initialization errors (in most cases found in this Repo's issues) are a result of loading angularjs before jquery. We need to load jquery before angularjs, so that angular uses jquery as the dom querying engine instead of the angular-bundled jqlite. That way jquery-ui plugins will be fine using dom-collection objects that are familiar with. In case that this does not resolves your issues, please fork the readme example that demonstrates the connected lists use case. The two sortables are already inside a repeater, so the changes needed should be as minimal as one extra line.

amcdnl commented 10 years ago

@thgreasi Thanks for the feedback. I was able to get it resolved by tweaking some actions that were causing re-execution due to recursion of my nested sortables.

Also, have you tried the Draggable -> Sort case: https://jqueryui.com/draggable/#sortable I was having some interesting results w/ it.

thgreasi commented 10 years ago

@amcdnl about draggable/#sortable take a look to #138

amcdnl commented 10 years ago

@thgreasi ya ... I started doing that but found the other way thought it might be better. Thanks for the update on that.

thgreasi commented 10 years ago

@amcdnl can you please provide further details on the solution you settled to? I`m trying to create a collection of useful use cases and add a FAQ.md with all of them.