Angularjs import Issue

[Diwan Oli M]

angularjs document says after jquery load u can import angularjs pluging , but my case if i load the same way i am getting 'On' is selected is not a function . if i load angularjs before jquery i didnt use the jquery method in my custom directory , i am geting  below error . please any one help me

Error: iElement.autocomplete is not a function
@http://localhost:7001/pcps/static/js/libs/jquery-1.6.4.min.js:91
nodeLinkFn@http://localhost:7001/pcps/static/js/plugins/angular.js:6312
compositeLinkFn@http://localhost:7001/pcps/static/js/plugins/angular.js:5722
compositeLinkFn@http://localhost:7001/pcps/static/js/plugins/angular.js:5725
compositeLinkFn@http://localhost:7001/pcps/static/js/plugins/angular.js:5725
publicLinkFn@http://localhost:7001/pcps/static/js/plugins/angular.js:5627
boundTranscludeFn@http://localhost:7001/pcps/static/js/plugins/angular.js:5741
controllersBoundTransclude@http://localhost:7001/pcps/static/js/plugins/angular.js:6332
ngRepeatAction@http://localhost:7001/pcps/static/js/plugins/angular.js:19684
$watchCollectionAction@http://localhost:7001/pcps/static/js/plugins/angular.js:11828
Scope.prototype.$digest@http://localhost:7001/pcps/static/js/plugins/angular.js:11930
Scope.prototype.$apply@http://localhost:7001/pcps/static/js/plugins/angular.js:12179
bootstrap/doBootstrap/<@http://localhost:7001/pcps/static/js/plugins/angular.js:1341
invoke@http://localhost:7001/pcps/static/js/plugins/angular.js:3762
bootstrap/doBootstrap@http://localhost:7001/pcps/static/js/plugins/angular.js:1340
bootstrap@http://localhost:7001/pcps/static/js/plugins/angular.js:1353
@http://localhost:7001/pcps/static/js/libs/jquery-1.6.4.min.js:191
._Deferred/e.resolveWith@http://localhost:7001/pcps/static/js/libs/jquery-1.6.4.min.js:2
._Deferred/e.done@http://localhost:7001/pcps/static/js/libs/jquery-1.6.4.min.js:2
e.prototype.ready@http://localhost:7001/pcps/static/js/libs/jquery-1.6.4.min.js:2
e.prototype.init@http://localhost:7001/pcps/static/js/libs/jquery-1.6.4.min.js:2
e@http://localhost:7001/pcps/static/js/libs/jquery-1.6.4.min.js:2
@http://localhost:7001/pcps/static/js/libs/jquery-1.6.4.min.js:190
.globalEval/<@http://localhost:7001/pcps/static/js/libs/jquery-1.6.4.min.js:2
.globalEval@http://localhost:7001/pcps/static/js/libs/jquery-1.6.4.min.js:2
bl@http://localhost:7001/pcps/static/js/libs/jquery-1.6.4.min.js:2
.each@http://localhost:7001/pcps/static/js/libs/jquery-1.6.4.min.js:2
.domManip@http://localhost:7001/pcps/static/js/libs/jquery-1.6.4.min.js:3
.append@http://localhost:7001/pcps/static/js/libs/jquery-1.6.4.min.js:3
.registerPlugin/</$.fn[n]@http://localhost:7001/pcps/static/js/plugins/jquery.livequery.js:178
.html@http://localhost:7001/pcps/static/js/libs/jquery-1.6.4.min.js:3
.registerPlugin/</$.fn[n]@http://localhost:7001/pcps/static/js/plugins/jquery.livequery.js:178
$.fireAjax/showResponse@http://localhost:7001/pcps/static/js/plugins/appframework-jquery.js:91
$.fireAjax/<.success@http://localhost:7001/pcps/static/js/plugins/appframework-jquery.js:77
._Deferred/e.resolveWith@http://localhost:7001/pcps/static/js/libs/jquery-1.6.4.min.js:2
w@http://localhost:7001/pcps/static/js/libs/jquery-1.6.4.min.js:4
.send/d@http://localhost:7001/pcps/static/js/libs/jquery-1.6.4.min.js:4

<input class="ng-pristine ng-valid" ng-model="componentCd" name="fiocodes" ng-auto-complete="" ui-items="fioPhaseAction.fioCodes">

I am import the plugin file below like this :
<script type="text/javascript" src="<c:url value="/static/js/plugins/angular.js"/>"></script>
       <script type="text/javascript" src="<c:url value="/static/js/plugins/angular-route.js"/>"></script>
        <script type="text/javascript" src="<c:url value="/static/js/libs/jquery-1.6.4.min.js"/>"></script>
        <script type="text/javascript" src="<c:url value="/static/js/plugins/jquery-ui-1.8.16.custom.min.js"/>"></script>

[Justin Walsh]

Load JQuery first

[Diwan Oli M]

If i load the jquery i am getting 'on'  method SelectElement.on not a function these errors

On Tuesday, 22 April 2014 12:46:21 UTC+5:30, Justin Walsh wrote:

Load JQuery first

[Gabriel Aszalos]

Try using RequireJS. This is what I do to avoid similar problems with the wrong order of files being loaded: https://github.com/backslashed/room24/blob/master/app/loader.js

I wonder why something like this isn't yet available in Angular. Yes, I do know we have loader.js but meh.

[Diwan Oli M]

I am getting below error:

TypeError: Object [object Object] has no method 'on' at pre (http://localhost:7001/pcps/static/js/plugins/angular.js:15763:27) at nodeLinkFn (http://localhost:7001/pcps/static/js/plugins/angular.js:6291:13) at compositeLinkFn (http://localhost:7001/pcps/static/js/plugins/angular.js:5722:15) at compositeLinkFn (http://localhost:7001/pcps/static/js/plugins/angular.js:5725:13) at nodeLinkFn (http://localhost:7001/pcps/static/js/plugins/angular.js:6305:24) at compositeLinkFn (http://localhost:7001/pcps/static/js/plugins/angular.js:5722:15) at nodeLinkFn (http://localhost:7001/pcps/static/js/plugins/angular.js:6305:24) at compositeLinkFn (http://localhost:7001/pcps/static/js/plugins/angular.js:5722:15) at compositeLinkFn (http://localhost:7001/pcps/static/js/plugins/angular.js:5725:13) at publicLinkFn (http://localhost:7001/pcps/static/js/plugins/angular.js:5627:30) <form name="modelDataform" id="modelDataform" class="ng-pristine ng-valid">

[ThomasBurleson]

Hey NG developers. Check out  https://github.com/ThomasBurleson/angularjs-Zza-BMEAN which uses RequireJS.

• Uses RequireJS and AMD 
  
• Uses NPM, Bower, Grunt
  
• Uses Grunt to deploy minified versions or dev version.
  
• Uses UI Router for complex routing, deep linking, and UI widgets
  
• Uses Animations for UX 
  
• Uses Breeze ORM for complex data persistence
  
• Uses full MEAN stack to provide NodeJS App server and Mongo database

Full source provided for learning and review. 

Maybe that repository and source will help everyone to side-step the headaches I encountered when I was addressing these same issues.

- ThomasB