Introduction to Jquery and Javascript in Drupal for Drupal 6, 7

Last updated March 2, 2020

Check your version

This tutorial covers a topic in Drupal 7 which may or may not be the version you're using. We're keeping this tutorial online as a courtesy to users of Drupal 7, but we consider it archived.

Alternate resources

Sprout Video

Learn how to integrate jQuery scripts into Drupal, and how to leverage the JavaScript capabilities of the Drupal API in both 6.x & 7.x

Jeff Robbins and Nate Haug introduce the jQuery and Drupal integrations that we'll be building in this series, based on the foundations of theming, module development, and jQuery.

  • How to add jQuery to a theme
  • How to utilize Drupal's drag and drop behavior to reorder elements on a page within any form that has orderable items
  • Drupal's direct integration with jQuery through the Forms API in Drupal 6 and Drupal 7
  • Building a highly optimized AJAX request to Drupal that will return a JSON result
  • The JavaScript state system in Drupal 7

Note: The examples in the video span across Drupal 6 and Drupal 7, and jQuery code that will work either in jQuery version 1.2.6 or 1.4.