Entity view (Content)

AHAH Made Easy with AHAH Helper

By rllabore
Nov. 7, 2011

In Drupal 6, AHAH powered forms are made easy. Easy in a sense that it is built in using the #ahah property. With the AHAH powered forms, it allows you to manipulate form elements on the fly without using a single line of Javascript code. However, as easy at it sounds, it is really time consuming and painful to use since you have to write callbacks for each AHAH enabled form element. Think about maintaining that code! Don't worry, AHAH Helper is here to alleviate the pain. Basically, this module simplifies the use of #ahah property. Now I will show you how I created an AHAH powered form using AHAH Helper. But before I dive in to that, you need to know a little about the problem that I'm trying to solve. I need to create a form that initially displays a drop-down and a submit button. When a user selects on of the valid options, another drop-down is displayed with additional options which is associated with what the user has selected. If I didn't know how to use the #ahah property, I would have to write Javascript code to do this. Thanks to AHAH Helper, I DON'T NEED TO. Here is the sample code that solves problem mentioned above.

function MY_MODULE_NAME_ahah_powered_form($form_state) {
  $form = array();
	
  /*  register your form */
  ahah_helper_register($form, $form_state);
	
  if(!isset($form_state['storage']['classification']['type'])) {
    $type_default_value = 0;
    } else {
    $type_default_value = $form_state['storage']['classification']['type'];
  }
	
  if(!isset($form_state['storage']['classification']['animal'])) {
    $animal_default_value = 0;
  } else {
    $animal_default_value = $form_state['storage']['classification']['animal'];
  }
	
  /* sample drop-box options */
  $type_options = array(
    0 => 'Choose Animal Type',
    1 => 'Invertebrates',
    2 => 'Vertebrates'
  );
  $animal_options[1] = array(
    0 => 'Choose Animal',
    3 => 'Mollusks',
    4 => 'Arthropods'
  );
  $animal_options[2] = array(
    0 => 'Choose Animal',
    5 => 'Fish',
    6 => 'Amphibians'
  );
	
  $form['classification'] = array(
    '#type'   => 'fieldset',
    '#title'  => t(''),
    '#prefix' => '
', '#suffix' => '
',
    /* Don't forget to set #tree! */
    '#tree'   => TRUE, 
  );
  $form['classification']['type'] = array(
    '#type'          => 'select',
    '#title'         => '',
    '#default_value' => $type_default_value,
    '#options'       => $type_options,
    '#ahah'          => array(
    'event'   => 'change',
    'wrapper' => 'classification',
      /* This is the "magical path". Note that the parameter is an array of
       the parents of the form item of the wrapper div! */
    'path'    => ahah_helper_path(array('classification')),
    ),
  );
	
  /* display if user has selected animal type */
  if($type_default_value) {
    $form['classification']['animal'] = array(
      '#type'          => 'select',
      '#title'         => '',
      '#default_value' => $animal_default_value,
      '#options'       => $animal_options[$type_default_value],
    );
  }
	
  $form['classification']['go'] = array(
    '#type'  => 'submit',
    '#value' => t('Go'),
  );
  return $form;	
}

Post Tags: