How to keep Drupal 4.7.x up to date with jQuery

(Submitted Tue, 2007-04-10 17:57) | | |

I've been developing an AJAX module for a client that needs to run on both Drupal 5 and Drupal 4.7. Unfortunately, the jQuery 4.7 module uses the now well outdated 1.0.3 version of jQuery and I was finding a number of incompatibilities cropping up between the more recent Drupal 5 version and the older Drupal 4.7 version.

Here's a simple way to bring your Drupal 4.7 up to date with the current version of jQuery, and to allow for simple upgrades when new versions of the library are released.

The really, really quick version

  • download the latest version of jQuery (you'll probably want to choose the compressed version)
  • rename the downloaded .js file to jquery-modified-compressed.js and replace the existing file of the same name in your jQuery47 module directory
  • open jquery-modified-compressed.js and add the following line to the end of the file:
    var JQ = jQuery.noConflict();
  • Enjoy!

The kinda-cleaner-depending-on-how-you-look-at-it version
Preferring not to alter the existing jQuery47 module as it really isn't needed when using this approach, I opted instead to recreate the drupal47_add_js function in the site's existing custom module and remove the drupal47 module altogether.

This is just a matter of adding the following function:

function jquery47_add_js($file) {
$jquery = drupal_get_path('module', 'my_module_name') . '/jquery.js';
drupal_add_js($jquery);
drupal_add_js($file);
}

Where my_module_name is, of course, the name of your custom module, and your downloaded jQuery javascript library is renamed to jquery.js and dropped into the same directory as your module.

Note that the name of the function (jquery47_add_js) is important, as this is the function name that contrib modules which rely on the jQuery library will call.

Submitted by John Wilkins (not verified) on Wed, 2007-04-11 20:00.

The jQuery documentation says that noConflict() does not define what is returned, so I'm not sure you need the var JQ = part of your javascript statement. i.e. just append to the jquery.pack.js file the following line:
jQuery.noConflict()

I encourage readers to take a look at the docs of this function: http://docs.jquery.com/Core#.24.noConflict.28.29

I used this method on a client's site 2 weeks ago, but didn't get a chance to write it up. Good tip!

Submitted by aqwicP on Sat, 2007-10-13 10:16.
Submitted by drawk on Wed, 2007-04-11 21:49.

Hi John, I'm glad you pointed that out.

The var JQ = jQuery.noConflict() part is only necessary if you are using modules that have been depending on the jquery47 module.

Using jQuery.noConflict() alone, you can still use jQuery by using the jQuery variable (rather than the '$' variable). However, if you've been using the jquery47 module up until now to implement jQuery functionality on your 4.7 site, you would need to go through all the code on your site and rename the JQ('*') calls to jQuery('*') calls, and remember to do so each time a module got updated.

By using the var JQ = jQuery.noConflict() statement, you can avoid all of that hassle. Code that depended on jquery47 will continue to operate as though nothing had changed, and no extra work.

Submitted by Mark Fredrickson (not verified) on Mon, 2007-04-23 21:58.

I'm the maintainer of jQuery 4.7. I was unaware that Drupal had upgraded to 1.0.4. As I mention in this ticket, I'm looking for co-maintainers who will help keep jQuery47 compatible with 5:

http://drupal.org/node/104845

Any takers?

Using the var JQ = jQuery.noConflict() method would be great!

-Mark

Post new comment

The content of this field is kept private and will not be shown publicly.
  • Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <blockquote>
  • Lines and paragraphs break automatically.
  • You may post code using <code>...</code> (generic) or <?php ... ?> (highlighted PHP) tags.
More information about formatting options

Hosted By Dreamhost.com


Did you know?

You don't need to register at WWDD to post comments.

Isn't it annoying when you want to comment on an article, but don't want to go through the hassle of creating yet-another-user account at yet-another-website?

Feel free to comment anonymously, or log in with your username@drupal.org account.

We won't mind a bit.