So I’ve decided to write an article for all the Drupal webmasters. If you never heared of Drupal, well Drupal is a free and open source content management system (CMS) written in PHP . It is used worldwide, ranging from personal blogs to large corporate and political sites including whitehouse.gov and data.gov.uk.

Important: A very useful Drupal php function is drupal_add_js(), with this function we can include a javascript file in the head section of the html output.

jQuery can be used when developing functionalities under the Drupal CMS because jQuery is part of the Drupal core since Drupal 5.

The main javascript core under Drupal is wrapped in the Drupal class found in drupal.js in /misc/ folder.

var Drupal = Drupal || {'settings':{},'behaviors':{},'themes':{},'locale':{} };

Drupal javascript functionalities are separated as behaviors.

For example the toggleable fieldset is a behavior that is set when a page loads. Behaviors are set using the Drupal.attachBehaviors() function.

If for example you have a fieldset added to your page using AJAX then you must call Drupal.attachBehaviors() to make that fieldset toggleable.When calling Drupal.attachBehaviors(), the function will try to attach behaviors to the entire document, if behaviors are already set then calling this function again will destroy the existing behaviors.

So let’s say we want to insert a fieldset from the AJAX response and we want to add the behavior just for that pieace of code, this is how it’s done:

var new_content = $('

').html(content.html_content);
Drupal.attachBehaviors(new_content);
 $('#test').append(new_content);

So we need to pass a jQuery object to the Drupal.attachBehaviors(), then we can add to the fieldset the required behavior.

Here is an example of a Drupal fieldset behavior integrated in this wordpress post:

Now you can use different Drupal functions (like Drupal.toggleFieldset) included in the main class on our fieldset. Here is an example of how the toggleFieldset function can be used:

Click here to toggle the fieldset

An other example of a drupal behaviour is the drupal textarea. Here is an example of such textarea:

Adding new behaviors is very easy, all that is needed is to extend Drupal.behaviors

Drupal.behaviors.custom = function (context) {
//add new behavior here
}

By adding to behaviors, your custom behavior will be called after the DOM is loaded on every page.