using ng-grid with angularjs & requirejs - "ReferenceError: jQuery is not defined"

Question

My angularjs project works fine with requirejs. I want to use the nggrid tables but somewhere the bootstrapping is not happening correctly and i am getting the "ReferenceError: jQuery is not defined" in ng-grid.debug

Here is my configuration:

app.js : Adding ngGrid module as the dependent module

angular.module('MyApp', ['controllers', 'services',
    'filters', 'directives', 'ngGrid']);

main.app: i already see Jquery being a dependency which should have been loaded loaded

require.config({
    paths: {
        jquery: 'vendor/jquery',
        angular: 'vendor/angular.min',
        domReady: 'vendor/domReady'
    },
    shim: {
        angular: {
            deps: [ 'jquery'],
            exports: 'angular'
        }
    }

});

require([
        'angular',
        'app',
        'domReady'
        'vendor/ng-grid.debug'

metalkat · Accepted Answer · 2014-06-23 18:42:02Z

1

In my experience, every time this error is thrown is because of the order you import the libraries. When I got this error, I had imported the ng-grid library with the other angular libraries, which was before jquery. Make sure it comes after both.

answered Jun 23, 2014 at 18:42

metalkat

6209 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

user3676608 · Accepted Answer · 2014-07-15 18:59:05Z

0

Not only does the order of the libraries matter also if you are using Visual studio MVC & web API the @Scripts.Render("~/bundles/jquery") does not import the JQuery library immediately

Solution

Use the script tag and this will work out just fine

Example: Mine scripts in my layout:

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.14/angular.min.js">     </script>
<script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.10.0.js"></script>

<script src="~/Scripts/ng-grid.js" type="text/javascript"></script>

answered Jul 15, 2014 at 18:59

user3676608

232 bronze badges

Collectives™ on Stack Overflow

using ng-grid with angularjs & requirejs - "ReferenceError: jQuery is not defined"

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related