CODEWITHSUNDEEP
jquerydrupaldrupal-6
aneuryzm
aneuryzm

Reputation: 64834

Drupal and the latest jQuery

I need to use the latest version of jQuery in my Drupal.

jQuery update module is not enough because it doesn't update jquery to its latest version.

Is there anyway to use the latest version of jquery in the front-end, and the drupal included version for the back-end ?

Should I work on the theme templates files ? Is this going to cause issues ?

thanks

Upvotes: 4

Views: 5113

Answers (5)

moldcraft
moldcraft

Reputation: 448

For the front-end I did something "bad", but it works.

I included the latest jQuery

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">$.browser = {msie: false}; // fix for scripts that use that property</script>

disabled the drupal's jQuery

<?php print str_replace(
    '<script type="text/javascript" src="/misc/jquery.js', 
    '<script no-drupal-jquery="', 
    $scripts
);
?>

and I get

<script no-drupal-jquery="?W"></script>
<script ...

Upvotes: 0

avpaderno
avpaderno

Reputation: 29689

Drupal includes the jQuery library in each page that uses JavaScript. The only way to use a more recent version of jQuery than the one Drupal comes with is to install jQuery Update, which provides also a script for compatibility with scripts using an older version of the library. The jQuery Update module updates:

  • Drupal 5 to jQuery 1.2.6
  • Drupal 6 to jQuery 1.3.2
  • Drupal 7 to jQuery 1.5.2, and jQuery UI 1.8.11

If you are going to simply replace the jQuery library contained in /misc, then Drupal scripts will stop to work (I tried doing that, and that was the result). Loading a more recent version after Drupal loaded the library in /misc will also cause problems.

To complete the information, there was a module that came with its own version of the jQuery library that was then binded to $ui; in that way, other code would still use the default jQuery library, while your module / theme would use the more recent library. The module simply loaded its own version of jQuery, and then executed the following JavaScript line:

window.$ui = jQuery.noConflict(true);

Using the same approach, you would be able to load the latest version of jQuery without creating any conflict with existing modules. This system doesn't work if you are using a module developed from somebody else, and that uses Javascript code that uses $; it works for your custom module/theme you run on your site, though.

Upvotes: 3

gagarine
gagarine

Reputation: 4338

Yes you can using jquery update (if you need jQuery 1.8 use the dev version) and a code like that in a module to switch version for front end and backend.

/**
 * Implements hook_module_implements_alter().
 */
function mymodule_site_module_implements_alter(&$implementations, $hook) {
  if ($hook == 'library_alter') {
    if(isset($implementations['jquery_update'])) {
      // Move jquery update to the end. This will make sure our hook_library_alter
      // is always called before the jquery_update.
      $jquery_update = $implementations['jquery_update'];
      unset($implementations['jquery_update']);
      $implementations['jquery_update'] = $jquery_update;
    }
  }
}

/**
 * Implements hook_library_alter().
 */
function mymodule_site_library_alter(&$libraries, $module) {
  // If it is the admin theme all we want to do is change the global $conf
  // variable so when jquery_update runs right after us it will use 1.5.
  // We are not using path_is_admin(current_path()) because some admin path can use
  // the frontend theme like node edit page
  global $theme_key;
  if (variable_get('admin_theme') == $theme_key) {
    // Modifying global $conf variable, can be dangerous. Be carefull.
    global $conf;
    $conf['jquery_update_jquery_version'] = '1.5';
  }
}

I write a blog post about it http://antistatique.net/blog/2013/01/04/drupal-use-a-different-jquerys-version-for-the-frontend-and-backend/ .

Upvotes: 2

user113292
user113292

Reputation:

What about using jQuery.noConflict()? I don't know of any concrete examples of Drupal modules that work in jQuery 1.2/1.3 but break in 1.4 to test this, but ostensibly loading jQuery 1.4 after Drupal loads jQuery 1.2/1.3 (so, add it to your theme) and using var jNew = jQuery.noConflict() would pass $() back to the jQuery most of Drupal expects, and allow you to use jNew() to do the jQuery 1.4 stuff you need to do.

Upvotes: 0

marcvangend
marcvangend

Reputation: 5642

Are you using separate themes for front-end and back-end? You can probably add some code to the themename_preprocess_page() function in the front-end's template.php to replace the jquery files in that theme only.

Upvotes: 0

Related Questions