Drupal 7 Module Development

JavaScript in Drupal
t('Los Angelas') => t('Los Angelas'),
),
'#ajax' => array(
'callback' => 'hello_world_simple_form_callback',
'wrapper' => 'ajax_markup_div',
),
);
$form['ajax_markup'] = array(
'#prefix' => '',
'#suffix' => '',
'#markup' => t('Hello World'),
);
if (!empty($form_state['values']['hello_city'])) {
$form['ajax_markup']['#markup'] = t("Hello !city", array('!city'
=> $form_state['values']['hello_city']));
}
return $form;
}
Here we have two form elements of hello_city and ajax_markup. The hello_city
element has a #ajax property, which is new to Drupal 7. It defines a callback, which
is an internal Drupal callback function, and a wrapper. This is the wrapper on the
page that will be updated by the response to the AJAX request.
The second element, called ajax_markup, is a markup form element. This element
holds HTML. We initially populate the markup with 'Hello World'. For this element
to be updated we need to add a wrapper to it. In this case the wrapper is a div with
the same ID that we set as the wrapper in the #ajax part of the hello_city element.
After the form is set up there is an if statement for the case when a value is available
on $form_state for the hello_city element. When the form is initially created,
there won't be a value. When the AJAX request is made, it will be passed through
this form with the values from the form. When that happens the if statement will
be executed causing the ajax_markup element to be updated.
This will be followed by the execution of the callback defined by the #ajax property
on the hello_world element. That function looks like this:
function hello_world_simple_form_callback($form, $form_state) {
return $form['ajax_markup'];
}
[ 306 ]