Callback function on change event

Question

I need to execute some functions when a field value changes. I tried both Drupal AJAX framework and classical Jquery, but in both cases the callback function is not executed. Adding a Jquery .change() :

(function ($, Drupal, window, document, undefined) {
  $(document).ready(function(){
    $("#foo").change( function(){
      var selected_date = $(this).val();
      $.ajax({
        type: "POST",
        url: "MYURL/"+selected_date ,
        data: selected_date,
        success: alert( selected_date)
      });
    });
  })
})(jQuery, Drupal, this, this.document);

The Jquery works fine. Then

/**
* Implementation of hook_menu().
*/
function MYMODULE_menu() {
  $items['MYURL/%'] = array(
    'page callback' => 'MYMODULE_get_liberte_id', 
    'page arguments' => array(1),
    'type' => MENU_CALLBACK,
    'access arguments' => array('access content'),
  );
  return $items;
}

function MYMODULE_get_liberte_id ($selected_date) {
  //DB queries and form alter or error messages here
}

I also tried with AJAX Framework :

//hook form alter
$form['foo']['#ajax'] = array(
  'callback' => 'MYMODULE_ajax_callback',
  'wrapper' => '.center-wrapper',
 );

function MYMODULE_ajax_callback($form, $form_state) {
  //is the function fired ???
  $commands[] = ajax_command_alert(t('MYMODULE_ajax_callback fired'));
  return '<div id="wrapper">'.date('Y-m-d').'<xmp>'.print_r($form_state['values'], true).'</xmp></div>';
  //DB queries and form alter or error messages here
}

dsm($form) shows that the field got #ajax attribute, but the callback function isn't executed.

I'm afraid I'm not on the right way, or at list I'm missing something :(

Answer 1

The #ajax['wrapper'] value should be id attribute, not a class, and without '#'. You can look about this here. The callback function should return a html content, a renderable array (which will replace the 'wrapper' on a call) or array of drupal ajax commands. You can try this and your code should work:

function MYMODULE_ajax_callback($form, $form_state) {
   $commands[] = ajax_command_alert(t('MYMODULE_ajax_callback fired'));
   return array('#type' => 'ajax', '#commands' => $commands);
}