Angluarjs UI Load Order is Important


Posted by Jason Hardin on December 22, 2012

I ran into some issues trying to get the angular-ui working with the modal. It turns out that you have to include the JavaScript libraries in a very specific order, which is not mentioned in the readme. The order is as follows:

1
2
3
4
5
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<script src="http://twitter.github.com/bootstrap/assets/js/bootstrap-modal.js"></script>
<script src="lib/angular/angular.js"></script>
<script src="lib/angular/angular-ui.min.js"></script>

This of course goes into the footer. If this is in the wrong order you get errors such as:

1
TypeError: Object [[object HTMLDivElement]] has no method 'modal'

I found the solution in a google group post