redconservatory
redconservatory

Reputation: 21924

CMS uses jquery 1.7, theme uses jQuery 1.6 == conflict

I've been given a theme to implement into a cms.

The theme uses jQuery 1.6 and has no javascript errors.

The CMS (concrete5) uses jQuery 1.7.1 and has no javascript errors.

When I merge the theme into the CMS, I drop the include to jQuery (since I was to avoid including jQuery twice) and now I am getting the following errors:

Uncaught TypeError: Property '$' of object [object DOMWindow] is not a function (ccm.app.js line 1 --> ccm.app.js is part of the CMS javascript).
Uncaught TypeError: Property '$' of object [object DOMWindow] is not a function (page controls menu.js).

The script src references are in this order:

- jQuery
- ccm.app.js (CMS)
- page controls menu.js (CMS)
- custom.js (my theme)

I realize that this isn't a lot of code to look at and troubleshoot, but does anyone know the differences between jQuery 1.6 and jQuery 1.7 that might be causing this kind of error?

Upvotes: 1

Views: 261

Answers (2)

redconservatory
redconservatory

Reputation: 21924

The answer above gets to the root of what was wrong, but I thought I would just mention this part in case any one else has the same problem.

For me, in my custom.js file, I have jQuery noConflict wrappers around each little bit of jQuery:

jQuery.noConflict()(function($){
   $(document).ready(function() {
     // some jQuery javascript here     

   });
});

Changing it back to just:

 $(document).ready(function() {
     // some jQuery javascript here     

   });

Got rid of the problem I was having.

Upvotes: 2

Snuffleupagus
Snuffleupagus

Reputation: 6735

The version of jQuery you're using isn't assigning the shortcut $. You can either change what you're referencing to script wise to one that is assigning the shortcut, or, immediately after importing jQuery

<script type="text/javascript">
$ = jQuery;
</script>

Upvotes: 2

Related Questions