Introducing
Drupal.behaviors
presentation by: Tom Friedhof

Review jQuery Basics

Review jQuery Basics
$( [find something] ).doSomething();

Review jQuery Basics
$( [find something] ).doSomething();
$(“#tabs”).tabs();
CSS Selector jQuery UI Method

The DOM has to be ready
$(document).ready(function() {
// Code Goes Here
});

The DOM has to be ready
$(document).ready(function() {
$(“#tabs”).tabs();
});

The Drupal Way
Drupal.behaviors.loadTabs = function(context) {
// Code Goes Here
};

The Drupal Way
Drupal.behaviors.loadTabs = function(context) {
$(“#tabs”).tabs();
};

Why use Drupal.behaviors?
• Ability to override JS
• Behaviors are re-attachable
• Attach Behaviors to a specific context
• HTML loaded via AHAH

Why use Drupal.behaviors?
• Ability to override JS
• Behaviors are re-attachable
• Attach Behaviors to a specific context
• HTML loaded via AHAH
Drupal.attachBehaviors(elem);

Demo
Drupal.behaviors

Resources
http://api.drupal.org/api/file/developer/topics/javascript_startup_guide.html/6
http://raincitystudios.com/blogs-and-pods/katherine-bailey/the-lowdown-
jquery-drupal-part-two
http://www.chapterthree.com/blog/josh_koenig/
handling_aysnchronous_data_drupal_session_materials

Questions?