JQuery Not Working in Drupal 7
If when converting a theme to Drupal 7 you get the following Javascript errror in your JQuery:
$ is not a function
This is because Drupal 7 improves compatability with other Javascript libraries so you need to put the following wrapper around your code:
(function ($) {
//your existing code
})(jQuery);
Looking to get started on Switchweb? Take a look at our website hosting plans or message us about a free trial.
Roman
6 March 2011Yes, this works! Thanks!
Scott
1 May 2011Oh thanks man, I was going nuts for over an hour trying to figure this out till I found your post. Perhaps this ought to be in the documentation somewhere?
SomeGuy
3 July 2011Just an hour Scott? I’m on day 3 and this didn’t do it either – it is as if jQuery is not installed, but it is part of the core. jQuery code doesn’t render – just displays on the page as text.
I wish there were a full tutorial with code examples to cut and paste which actually work – unlike the examples I’ve pasted which don’t – maybe there is but haven’t found it in days of searching.
Scott
3 July 2011SomeGuy, I’m not sure exactly what problem you’re experiencing there, if your JS is displaying as text it sounds like you don’t have script tags around your JS code which suggests you’re not adding it correctly.
If the JS is inserted into the page correctly and the problem really is getting jQuery to work, there are two other options you can try:
1. replace all instances of ‘$(‘ with ‘jQuery(‘ in your JS code.
2. Add the line ‘var $ = jQuery;’ at the top of your JS code.
See http://drupal.org/node/171213 for more info.
Mike Rusczyk
23 August 2011I just want to say thanks I was going nuts disassembling every process in my site trying to debug something that was another Drupal methodology change.
Lets hear it for more fluctuating methodologies in the name of progression.
Bhupendra
21 September 2011Thanks dude.
Quinton
6 October 2011I was going absolutely crazy with this same problem in Drupal 7. It was loading jquery.js but still not working. Glad I found this, this solved it! Thanks much.
Dileep
23 December 2011Thanks Man,
It was really great solutions.
Mat
24 May 2012Thanks Scott, your suggestion of using
var $ = jQuery;
worked like a charm!