Monday, June 02, 2008

Things you should know about jQuery and Drupal

So in my last post I told you how much I love drupal. Although I had been using drupal to build a web app I hadn't been making use of jQuery at that point. jQuery is almost necessary if you want to add visual effects (client-side) and/or use AJAX within drupal. It was somewhat painful for me to get motivated enough to learn jQuery as I felt there was not a good starting point so in this post I'd like to establish some really basic guidelines for new Drupal developers who wish to use jQuery and do not wish to dig through the Drupal forums or sit through long, sleep-inducing screencasts.

Here's what I learned so far:

  • Don't bother with "inline" jQuery via the drupal_add_js function...inline Javascript isn't cacheable and you WILL get bitten when trying to escape quotes. Create a separate .js file and put all of your jquery in it instead - then use drupal_add_js to link to your Javascript.

  • Spend some time browsing visualjquery.com and don't move past it until you are comfortable with jQuery's syntax...you really will like it once you get going

  • Watch out for relative vs. absolute paths when including external Javascript (jQuery) files within a Drupal module. Use drupal_get_path to build your paths for you.

  • Firebug is your friend



Is this advice simple and perhaps somewhat contrived? You bet. Finding this advice all in one place isn't all that easy so I felt it was my duty to post it! And finally, for the love of god, if you are trying to create a sweet lightbox effect inside your web app, steer clear of Facebox and try your luck with ThickBox instead. :-)

Stay tuned as I raise the bar further and use jQuery inside of Drupal to bring my first AJAX module to life.

No comments: