• Opening the modal and clicking "Submit" dismisses the modal as desired.
  • The "Ajax callback" button also fires without trouble.
  • However: clicking on the "Ajax callback" button, and then on the "Submit" button causes the ajax command to be dumped to a white screen.

Relevant code:

<?php
/**
 * Add to list. Use ctools to create a modal popup if js is enabled.
 */
function node_list_add_to_list($js = NULL, $nid) {
  
  // Fall back if $js is not set.
  if (!$js) {
    return drupal_get_form('node_list_add_to_list_form', $nid);
  }

  ctools_include('modal');
  ctools_include('ajax');
  $form_state = array(
    'title' => t('Add to List'),
    'ajax' => TRUE,
    'build_info' => array('args' => array('0' => $nid)),
  );
  $output = ctools_modal_form_wrapper('node_list_add_to_list_form', $form_state);
  if (!empty($form_state['executed'])) {
    $commands = array();
    $commands[] = ctools_modal_command_dismiss();
    print ajax_render($commands);
    exit;
  }
  else {
    print ajax_render($output);
    exit;
  }
}

/**
 * A modal login callback.
 */
function node_list_add_to_list_form($form, &$form_state, $nid) {
  
  // Wrapper for entire form
  $form['#prefix'] = '<div id="all-fields">';
  $form['#suffix'] = '</div>';  
  
  // Test button
  $form['test'] = array(
    '#type' => 'button',
    '#value' => t('Ajax callback'), 
    '#ajax' => array(
      'callback' => 'node_list_add_to_list_form_rebuild_entire_form_callback',
      'wrapper' => 'all-fields',
    ),    
  );   
  
  $form['submit'] = array(
    '#type' => 'submit',
    '#value' => t('Submit'),
  );      
  
  return $form;
}

/**
 * Ajax callback to rebuild the entire "add to list" form.
 *
 * Selects and returns the new_list_fieldset.
 */
function node_list_add_to_list_form_rebuild_entire_form_callback($form, $form_state) {
  return $form;
}

function node_list_add_to_list_form_submit($form, $form_state) {
  dsm('submitted');
}
?>

Ajax dump:
[{"command":"settings","settings":{"basePath":"\/","pathPrefix":"","ajaxPageState":{"theme":"pixel_minimal","theme_token":"KrgISNYT_6LaNezE-qf7D1sFBaf18Y0LsQq_kliQHSI","css":[]},"CToolsModal":{"loadingText":"Loading...","closeText":"Close Window","closeImage":"\u003cimg typeof=\"foaf:Image\" src=\"http:\/\/dev.pixelscrapper\/sites\/all\/modules\/ctools\/images\/icon-close-window.png\" alt=\"Close window\" title=\"Close window\" \/\u003e","throbber":"\u003cimg typeof=\"foaf:Image\" src=\"http:\/\/dev.pixelscrapper\/sites\/all\/modules\/ctools\/images\/throbber.gif\" alt=\"Loading\" title=\"Loading...\" \/\u003e"},"admin_menu":{"destination":"destination=node-list\/ajax\/add-to-list\/120","hash":"be6227e3b956692c63ddb3afd521eb50","basePath":"\/admin_menu","replacements":{".admin-menu-users a":"0 \/ 1"},"margin_top":1}},"merge":true},{"command":"modal_dismiss"}]

Comments

merlinofchaos’s picture

Status: Active » Fixed

The modal will naturally ensure any button inside it is submitted via ajax.

However, using another method of getting the form via AJAX may not have that guarantee. Therefore, you may be required, when using that method, to attach AJAX behavior to those buttons.

Take a look at modal.js to see what it does; mostly it just assumes any form inside the modal is intended to be submitted via AJAX. You will need similar code to fire for your ajax render.

jordanmagnuson’s picture

Ah, okay, that makes sense :) .

Thank you very much for the quick and helpful reply!

For anyone who might be trying to accomplish this same thing in the future, I messed around with this for a while, but decided that the easiest way to return all the form elements as I was wanting to do, without messing with js, was just to wrap all the elements like so:

<?php
/**
 * A modal login callback.
 */
function node_list_add_to_list_form($form, &$form_state, $nid) {
  
  // Wrapper for entire form
  $form['all_elements'] = array(
    '#prefix' => '<div id="node-list-add-to-list-all-elements-wrapper">',
    '#suffix' => '</div>',    
  );      
  
  // Test button
  $form['all_elements']['test'] = array(
    '#type' => 'button',
    '#value' => t('Ajax callback'), 
    '#ajax' => array(
      'callback' => 'node_list_add_to_list_form_rebuild_entire_form_callback',
      'wrapper' => 'all-fields',
    ),    
  );   

  // more elements here, all children of ['all_elements']
  //...
  //...
  
  $form['submit'] = array(
    '#type' => 'submit',
    '#value' => t('Submit'),
  );      
  
  return $form;
}
?>

Then return ['all_elements'] in my ajax callback:

<?php
/**
 * Ajax callback to rebuild the entire "add to list" form.
 *
 * Selects and returns the new_list_fieldset.
 */
function node_list_add_to_list_form_rebuild_entire_form_callback($form, $form_state) {
  return $form['all_elements'];
}
?>

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.