Ajax button strange behaviour when clicked twice

Question

I have a form where there is a dropdown with names, a button to add the names to a table and a table showing the list of names.

When clicking the button, an AJAX request is fired, the selection is added to a database table, the html table is reloaded and updated.

Everything works fine for the first click. The assigned ajax callback routine is called.

When I like to add the second name, the ajax callback is NOT called, but the standard submit function is called instead.

Here is some sample code - first the elements for the form:

$form['auctionpersons']['add_person'] = array(
  '#type' => 'select',
  '#title' => t('Select person to add'),
  '#options' => $aPersons,
);
$form['auctionpersons']['add_person_btn'] = array(
  '#type' => 'button',
  '#value' => 'Add person',
  '#description' => 'Click button to add person',
  '#ajax' => array(
      'callback' => 'add_auction_person_ajax_callback',
      'effect' => 'fade',
  ),
);
...
$form['auctionpersons']['ptable'] = array(
  '#theme' => 'table',
  '#header' => $pheader,
  '#rows' => isset($aPersonsTable)?$aPersonsTable:null,
  '#disabled' => TRUE,
  '#title' => 'Users currently assigned',
  '#empty' => t('No users assigned yet!'),
  '#prefix' => '<div id="ptable_wrapper">',
  '#suffix' => '</div>',
);

Now the function for the ajax callback:

function add_auction_person_ajax_callback($form, &$form_state) {
  dpm('172: add_auction_person_ajax_callback');
  dpm($form_state);
  add_person_to_table($form_state['values']['add_person']);
  $aPersonsTable=get_person_table_rows();
  $form['auctionpersons']['ptable']['#rows']=$aPersonsTable;
  $commands = array();
  $commands[] = ajax_command_html('#ptable_wrapper', render($form['auctionpersons']['ptable']));
  return array('#type' => 'ajax', '#commands' => $commands);
}

Can anyone see the problem?

Answer 1

Problem solved! The button must be of type "submit" instead of "button"! So the correct code is:

$form['auctionpersons']['add_person_btn'] = array(
  '#type' => 'submit',
  '#value' => 'Add person',
  '#description' => 'Click button to add person',
  '#ajax' => array(
      'callback' => 'add_auction_person_ajax_callback',
      'effect' => 'fade',
  ),
);

Thx for viewing this question :-)