Drupal form JavaScript delay

Question

Can anyone tell me how I can execute my custom jQuery code when Drupal's ajax code finishes?

The context is a Drupal module which displays a form. One of the form components is a select list displayed with the following code:

$form['selected'] = array(
'#type' => 'select',
'#title' => t('add to sequence ...'),
'#options' => $types,
'#default_value' => $types['select'],
'#description' => t('Select an option.'),
'#ajax' => array(
    'callback' => '_ajax_selected_node_callback',
),
);

Drupal correctly calls _ajax_selected_node_callback each time an option is selected. I need to execute my custom jQuery code immediately after the select list AJAX callback finishes.

Answer 1

One way would be to use Drupal.settings to pass info to your custom JS file after the AJAX callback finishes. So in your form you would add something like:

if (isset($form_state['values']['selected'])) {
  drupal_add_js(array('MODULENAME' => array('selected' => $form_state['values']['selected'])), 'setting');
}

and in your custom JS file you would have something like:

(function ($) {

Drupal.behaviors.MODULENAME = {
  attach: function(context, settings) {
    // listen for select to change and get the value if it does
    if (typeof settings.MODULENAME != "undefined" && typeof settings.MODULENAME.selected != "undefined") {
      $value = settings.MODULENAME.selected;
      // do something
    }
  }
};

})(jQuery);

I've not checked the above for bugs, but my point is to use Drupal.settings.