Difficulties with the #ajax form item attribute

Question

My form item is the following one:

$form['foo'] = array( 
  '#title' => t('Foo'),
  '#type' => 'radios',
  '#options' => $options,
  '#description' => t('Lorem ipsum.'),                                                     
  '#required' => true,
  '#ajax' => array(
    'callback' => 'foo_get_js', 
    'wrapper' => 'foo-wrapper',
    'event' => 'click',
    'method' => 'replace',          
  ),
);

My AJAX function is the following one:

function foo_get_js($form, $form_state) {
  return mktime().'<xmp>'.print_r($form_state['values'], true).'</xmp>';
}

My wrapper will get updated the first time the ajax call is made, but after that it will stay the same: the time and $form_state don't get updated. If I use the 'append' method instead of the 'replace' method then everything works as intended.

Is it the supposed behavior?

Answer 1

Since 'foo-wrapper' is replaced at the first call, it doesn't exist in the second call, and therefore, the callback doesn't know where to put the return value.

A simple solution would be to include a wrapper in the return value, with the same id as 'foo-wrapper'.

function foo_get_js($form, $form_state) {
  return '<div id="foo-wrapper">' . mktime() . '<xmp>' . print_r($form_state['values'], true) . '</xmp></div>';
}

Please note that this is untested.

Answer 2

If you use replace, you also need to return the original wrapping tag which has the 'foo-wrapper' id.