Combining AHAH with AJAX autocomplete?

karlmoritz - March 8, 2008 - 11:42
Project:AHAH Forms Framework
Version:5.x-1.5-5
Component:Code
Category:support request
Priority:normal
Assigned:Unassigned
Status:closed
Description

Hi, thanks alot for this module. I'm using expandable forms in a website I'm currently building and have used a generic solution so far, using very non-Drupal code. This here helps makes things a lot more elegant :)

What I'm trying to achieve is a single textfield with autocomplete (taxonomy based), that upon selection will add a dynamic form element containing that textfield and some additional fields. Basically this functionality is provided by the Todos demo included in this module. Now I have two problems:

1) (Important): To achieve the autocomplete functionality, I've simply modified the _todos_add_control function, adding the autocomplete functionality to the textbox:

<?
$element['new_item']['text'] = array (
    '#type' => 'textfield',
    '#title' => t( 'Text' ),
    '#size' => 40,
    '#autocomplete_path' => 'taxonomy/autocomplete/3',
    '#maxlength' => 128,
);
?>

This works fine for the first item, but once hitting "Add new item", autocompletion no longer seems to work for the field. I'm not very good with Javascript, so not entirely sure why this should stop working, but is there an obvious issue I'm overlooking here?

2) (Not so much): Don't think this is necessarily related to this module, but is there a clean way to add the new form element once selecting something out of the autocomplete list (or typing a comma) rather than having to manually hit the "add new item" button?

Thanks for reading this far. I hope I've made the issue clear, but if not, please let me know and I'll try to be more precise.

#1

karlmoritz - March 8, 2008 - 11:58

Regarding issue (1), the problem seems to be that the AHAH refresh disassociates elements from the AJAX listener (sorry for rubbish lingo, as I said, I don't really understand JS).

This fixes the problem:

/**
*  Attach listeners to all elements
*/
Ahah.attach_all_bindings = function( wrapper ) {
  var element;
// Drupal.ahah.elements is an array of arrays of elements
  for (var i in Drupal.settings.ahah.bindings ) {
    for (var j in Drupal.settings.ahah.bindings[i] ) {
      element = Drupal.settings.ahah.bindings[i][j];
      Ahah.attach_to_element( element, wrapper );
    }
  }
  Drupal.autocompleteAutoAttach(); // Re-attach Autocomplete functionality
};

Obviously that requires hacking into the ahah_forms.js file. Is there an obvious & more elegant solution, I'm missing out on?

Thanks!
kmh

#2

starbow - March 11, 2008 - 16:59

Yeah, kmh is exactly right. This is a pain in Drupal 5, and is why Drupal 6 introduces js behaviors and the Drupal.attachBehaviors call.

#3

rod.murphy - March 25, 2009 - 13:45

As far as you know, starbow, is kmh's change to ahah_forms.js likely to cause any problems?

Great module, bty.

#4

starbow - July 21, 2009 - 21:51
Status:active» closed
 
 

Drupal is a registered trademark of Dries Buytaert.