--- title: "How to implement Drupal AJAX Autocomplete · Appnovation" url: "https://www.appnovation.com/insights/how-implement-drupal-ajax-autocomplete" description: "Build faster, friendlier Drupal forms with AJAX autocomplete. A step-by-step guide to implementing autocomplete fields in Drupal." --- Article # How to implement Drupal AJAX Autocomplete [![](https://cdn.sanity.io/images/ey850001/production/36eb314260fb474cacc1b3a473d7e8402d997898-68x68.png?w=68&auto=format) Appno Blogger Appnovation Coop](/people/appno-blogger.md) Mar 02, 2009 3 min read ![Appnovation Blog Default Header](https://cdn.sanity.io/images/ey850001/production/9efe1c26d9584ecfb3dfef5a63e698bf4567d305-1440x600.jpg?w=1400&auto=format) AJAX helps you create better, faster and more user-friendly web applications with its Javascript and HTTP base. It allows the page content to be updated without reloading a whole page. In [Drupal web development](/services/drupal-development.md), AJAX functionality is provided through functions in the Javasript file drupal.js, and some AJAX functions are supported by Drupal core. I am going to explain the autocomplete which is one of the AJAX functions implemented in Drupal. When users type into a text filed, new data from the server is dynamically loaded and displayed as a list of matching options. Exchanging data beteween client and server, and updating the content are handled by the autocomplete.js. The textfield type form input has the #autocomplete\_path attribute which is the path that the AJAX autocomplete script uses as the source for autocompletion. You can easily implement the AJAX autocomplete to your form using the #autocomplete\_path attribute. Implementing the autocomplete contains two parts:1) a form input textfield and 2) a handler function to parse the request and return a response. There are build-in autocomplete handler functions such as user\_autocomplete() and taxonomy\_autocomplete(). Here is a simple example of how to implement the autocomplete uisng the user\_autocomplete() function. function example\_form(){ $form\['item'\] = array( '#type' => 'textfield', '#autocomplete\_path' => 'user/autocomplete' ); } This user/autocomplete path calls the user\_autocomplete() function and loads matching user names. Also, you can create a custom autocomplete handler to meet a need for your site. Let’s say you have a text field which asks users to select a node item on the site. function example\_form(){ $form\['item'\] = array( '#type' => 'textfield', '#autocomplete\_path' => 'example/autocomplete' ); } function example\_menu($may\_cache) { $item\[\] = array( 'path' => 'example/autocomplete', 'callback' => 'example\_autocomplete', 'access' => user\_access('access example autocomplete') ); } function example\_autocomplete($string){ $items = array(); $result = db\_query("SELECT nid, title FROM {node} WHERE status = 1 AND title LIKE ''%s%%', $string"); while($obj = db\_fetch\_object($result)) { $items\[$obj->nid\] = check\_plain($obj->title); } print drupal\_to\_js($items); exit(); } User input is passed from the parameter and the array of matching items is printed as the response. Note that you need to escape the node titles using check\_plain() because the values are HTML. Also note that you need to use your autocomplete handler callback has proper access permission.It might be exposing some sensitive information on the site. Building Rich Internet Apps with Drupal & HTML5 Learn the power of combining Drupal + HTML5 + CSS3 + JS  [![](https://cdn.sanity.io/images/ey850001/production/36eb314260fb474cacc1b3a473d7e8402d997898-68x68.png?w=68&auto=format) Appno Blogger Appnovation Coop · Appnovation](/people/appno-blogger.md) ## Keep reading [![What is Sovereign AI](https://cdn.sanity.io/images/ey850001/production/a5889abdd5e80376912546622e046e3fbef234b4-2496x1664.png?w=640&auto=format)](/insights/what-is-open-source-sovereign-ai.md) Article · 7 min AI ### [What Is Open Source, Sovereign AI?](/insights/what-is-open-source-sovereign-ai.md) Every company is encouraging more AI, and almost every AI bill is climbing. Sovereign AI is about two kinds of control: over your data and over your costs. Here's why open source sits at its foundation. [Iain MacNeil](/people/iain-macneil.md) Article [![AI-first experience design](https://cdn.sanity.io/images/ey850001/production/8bbc2418e87924ef10f36115478a2e10d5bed95e-1584x624.jpg?w=640&auto=format)](/insights/how-build-ai-first-experience-without-throwing-out-everything-youve-already-built.md) Article · 6 min AI Sep 10, 2026 ### [How to Build an AI-First Experience Without Throwing Out Everything You've Already Built](/insights/how-build-ai-first-experience-without-throwing-out-everything-youve-already-built.md) Users now expect a direct answer, not a list of links to click through. Here's how organizations can layer an AI-First experience onto their existing website or app, in weeks rather than years. [Andrew Douglas](/people/andrew-douglas.md) Article [![What Becomes Possible When AI Can Read All the Data](https://cdn.sanity.io/images/ey850001/production/c28ab0bd26753421ee42937e13adc7a7f19b47f0-1296x510.jpg?w=640&auto=format)](/insights/what-becomes-possible-when-ai-can-read-all-data.md) Article · 4 min AI Sep 09, 2026 ### [What Becomes Possible When AI Can Read All the Data](/insights/what-becomes-possible-when-ai-can-read-all-data.md) Most of the world's data has never been analyzed, only sampled. AI changes that. How AI-ready data platforms unlock questions no one could ask before. [Appnovation](/people/appnovation.md) Article ## Get the thinking, *before everyone else.* One considered email a month. New essays, field notes from live engagements, and the occasional strong opinion. No noise.