Menu
I'm using Angular JS and Angular UI (via a gem : angular-ui-rails) and today I'm stuck with module dependancies. If anyone has an idea !
I would like to add the sortable module ( https://github.com/angular-ui/ui-sortable ) on my app that looks like this example :
http://jsfiddle.net/g/hKYWr/
The thing is that I already have UI-bootstrap module loaded on it, so I try to do this :
on app.js :
angular.module('ui', ['ui.bootstrap','ui.sortable']);
on controllers.js
function dndCtrl($scope) {
$scope.list = ["one", "two", "three", "four", "five", "six"];
}
a sortable.js file loaded in the app. The order of js is :
//= require jquery
//= require jquery_ujs
//= require underscore
//= require angular.min
//= require ./angular/controllers/app.js
//= require_tree ./angular
//= require_tree .
and so the sortable.js file is loaded after app.js and just before ui-bootstrap js file (in ./angular tree)
Then last : my html file with a simple list loop with angular :
<html ....... ng-app="ui">
.....
<div ng-controller="dndCtrl">
<ul ui-sortable ng-model="list">
<li ng-repeat="item in list" class="item">{{item}}</li>
</ul>
<hr />
</div>
The loop's working well and UI bootstrap (Typeahead in my case too) but not sortable and console renders a
TypeError: Object [object Object] has no method 'sortable'
What did I do wrong or miss ?
827
UI-sortable depends on jQuery UI. It doesn't look like you have included jQuery UI JavaScript file. Note that you can either include the whole jQuery UI library or create a custom build with just the sortable module.
106
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
