Categories

(111)
(64)
(166)
(21)

#autocomplete_path in textfield elements

11.04.2011
Author:

Sometimes in the web development process the need arises to create autocomplete field in order to enhance usability. As worked examples of such fields widgets for cck-fields Node reference and User reference can be mentioned.

Let's look at some attempts of program creation of such fields. According to Drupal Forms API reference #autocomplete_path function can be added only for textfield element. This feature will identify the path through which Drupal JavaScript-code that is automatically turned on will send HTTP-requests, using JQuery.

First of all, we'll announce textfield in the form:

php
$form['example'] = array( 
  '#type' => 'textfield', 
  '#title' => t('Example Textfield'), 
  '#autocomplete_path' => 'products/autocomplete', 
);

Now we'll identify callback for autocomplete in hook_menu():

php
/** 
 * Implementation of hook_menu 
 */ 
function module_menu() { 
  $items['products/autocomplete'] = array( 
    'page callback' => 'module_products_autocomplete', 
    'type' => MENU_CALLBACK, 
    'access arguments' => array('administer nodes'), 
  ); 

  return $items; 
}

Finally, we must describe callback function itself that will transfer some array of drupal_json() function:

php
function module_products_autocomplete($string) { 
  $matches = array(); 
  $res = db_query("SELECT title, nid FROM {node} WHERE LOWER(title) LIKE LOWER('%s%%')", $string);

  while ($row = db_fetch_array($res)) { 
    $matches[$row['nid']] = $row['title']; 
  } 
  drupal_json($matches); 
}

Now we have a full-blown autocomplete field.

Quite often, though, there is a need to pass some parameters of autocomplete function. In my case, there was a need to pass an array of node identificators and to limit the scope of nodes to only this array in autocomplete. For this reason we'll identify page arguments in hook_menu() for that:

php

/** 
 * Implementation of hook_menu 
 */ 
function module_menu() { 
  $items['products/autocomplete/%'] = array( 
    'page callback' => 'module_products_autocomplete', 
    'page arguments' => array(2), 
    'type' => MENU_CALLBACK, 
    'access arguments' => array('administer nodes'), 
  ); 

  return $items; 
}

Let's make some amendments in the autocomplete_path settings for textfield definition :

php
//we get $nids array with identificators of nodes 
$string_nids = implode('|', $nids); 
$form['example'] = array( 
  '#type' => 'textfield', 
  '#title' => t('Example Textfield'), 
  '#autocomplete_path' => "products/autocomplete/{$string_nids}",
);

$string parameter is being automatically passed to autocomplete function with the help of API. If you want to pass additional parameters, place them before $string:

php
function module_products_autocomplete($arg2, $string) { 
  $matches = array(); 
  $nids = explode('|', $arg2); 
  $res = db_query("SELECT title, nid FROM {node} WHERE LOWER(title) LIKE LOWER('%s%%') AND nid IN (" . db_placeholders($nids, 'int') . ")", array_merge(array($string), $nids));

  while ($row = db_fetch_array($res)) { 
    $matches[$row['nid']] = $row['title']; 
  } 
  drupal_json($matches); 
}

Drupal will visualize all above-mentioned the following way:

6 votes, Rating: 5

Read also

1

The use of batch operations ebables forms processing to be performed in the...

2

In this article I'm going to describe how to operate the main hooks of Fields API entity.

Fields API is one of the entities of Drupal 7 API that allow us:

to create customizeable...

3

Fast page upload onto the user's browser is a key factor of your site's popularity. If page load time appears to be tiresomely long, it decreases visitor/user engagement and may even induce a user...

4

SSH is a network protocol of session layer that allows remote control of operating system and tunneling of TCP-connection (e.g. for files exchange).

5

If you know what jQuery is or you just start studying it, then you’ll definitely be interested in how to write your own jQuery plugin. It’s very easy to do that. You’ll be able to create your own...

Need a quote? Let's discuss the project

Are you looking for someone to help you with your Drupal Web Development needs? Let’s get in touch and discuss the requirements of your project. We would love to hear from you.

Join the people who have already subscribed!

Want to be aware of important and interesting things happening? We will inform you about new blog posts on Drupal development, design, QA testing and more, as well news about Drupal events.

No charge. Unsubscribe anytime