Drupal 6: Embedding a Drupal search form on another site using jQuery
In this tutorial I’ll show you how you can expose your search form on another site using jQuery. At first, I thought about scraping the form’s html using AJAX.. and quickly remembered you cannot easily do that. Which lead me to review the AJAX functionality included in jQuery. Bingo, one of my favorites: jQuery.getJSON. To summarize this code, I create a callback function to display the form’s json-ified html which can then be easily embedded on another site.
First I defined the menu hook:
Then I created the callback function for the menu callback:
One problem though, the form submits locally. That can be fixed using a form_alter function:
Now if you clear your cache and go to http://YOURSITE/external-search.js, you should see the JSON (and nothing else).
Last you can embed the code on another site using a few lines of jQuery. You can even pull the jQuery from your site if the external site does not have jQuery included.
Now people should be able to access your site’s search form from another site.