jQuery for Designers and Themers--Notes

I've been reading up on JavaScript and jQuery in Drupal in preparation for my upcoming Google Summer of Code project, so I thought I'd check out the JavaScript presentations at DCSF, starting with this one.

This is a simple introduction to attaching a simple JS file through the theme layer and using jQuery to mess around with things, going into jQuery UI at the end. Bevan also shows some good debug techniques in Firebug.

Here are some Drupal specific highlights for the readers.


You can add scripts to your theme by adding this to your .info file

scripts[] = myscript.js

In your script file, you should use Drupal.behaviors.myfunction instead of just using .ready. If you were selecting .modal and some more elements with .modal were added to the page during interaction, if you were just using ready then those new elements wouldn't have the JS applied to them. If you use Drupal.behaviors, the JS will be applied to the new elements.

You need to pass in the context variable to the function defined as myfunction. It can then be used as the second parameter in jQuery function calls.

A question came up about the security of using values passed in by the user. You can use Drupal.checkPlain to ensure that the values are actually plain text. If you look in the Drupal object in Firebug console, you can see these kinds of functions that drupal.js offers.