Submitting a Form with AJAX in a block

Question

So, I have a form that I wish to appear in a block. Now, I don't want the submission of this form to trigger an entire page reload, so I was hoping to use the built in AJAX framework.

I've tried several different things, but my current code is below. The data gets saved, but I can't figure out how to reset the form; anything I've tried has just left the data in the fields. Any help would be appreciated. Thanks.

/**
 * Implements hook_block_view()
 */
function test_contact_block_block_view($delta)  {
  switch ($delta) {
    case 'contact_block':
      $block['subject'] = t('Contact');
      $block['content'] = drupal_get_form('test_contact_block_form');
      break;
  }
  return $block;
}

function test_contact_block_form($form, &$form_state)   {
for_testing();

$form = array();
$form['form'] = array(
    '#prefix' => '<div id="form-wrapper">',
    '#suffix' => '</div>',
);
$form['form']['access_id'] = array(
    '#type' => 'textfield',
    '#title' => t('Customer Access ID'),
    '#size' => 10,
    '#required' => true,
);
$form['form']['summary'] = array(
    '#type' => 'textfield',
    '#title' => t('Summary'),
    '#size' => 20,
    '#required' => true,
);
$platforms = explode(chr(13), variable_get('test_waiver_platforms', ''));
$form['form']['platform'] = array(
    '#type' => 'select',
    '#title' => t('Platform'),
    '#options' => array_combine($platforms, $platforms),
);
$contact_channels = explode(chr(13), variable_get('test_waiver_contact_channels', ''));
$form['form']['contact_channel'] = array(
    '#type' => 'select',
    '#title' => t('Contact Channel'),
    '#options' => array_combine($contact_channels, $contact_channels),
);
$form['form']['minutes'] = array(
    '#type' => 'textfield',
    '#title' => t('Minutes'),
    '#size' => 10,
    '#required' => true,
);
$form['form']['category'] = array(
    '#type' => 'select',
    '#multiple' => true,
    '#title' => t('Category'),
    '#description' => t('ctrl+click (Win)/cmd+click (Mac) to select more than one.'),
    '#options' => _get_services(),
    '#size' => 15,
    '#required' => true,
);
$form['form']['submit'] = array(
    '#type' => 'button',
    '#value' => t('Submit Contact'),
    '#attributes' => array('onclick' => 'return false;'),
    '#ajax' => array(
        'wrapper' => 'form-wrapper',
        'callback' => 'test_contact_block_form_callback',
    )       
);
$form['form']['message'] = array(
    '#type' => 'item',
    '#markup' => t('Only for <b><u>NON</u></b> waivers.'),
);

return $form;
}

function test_contact_block_form_callback($form, &$form_state)  {
if(!ctype_digit($form_state['values']['minutes']))  {
    form_set_error('minutes', 'You must enter an integer for minutes');
}
else {// THE INCLUDE IS JUST FOR THE FUNCTION BELOW THAT'S COMMENTED OUT
    //module_load_include('inc', 'test_waiver', 'test_waiver.admin');
    // Gather all the variables
    global $user;
    $user_accessid          = $form_state['values']['access_id'];
    $summary                        = $form_state['values']['summary'];
    $platform                   = $form_state['values']['platform'];
    $contact_channel      = $form_state['values']['contact_channel'];
    $time_spent                 = $form_state['values']['minutes'] * 60;
    $categories                 =   $form_state['values']['category'];
    $comments                   = '';
    $last_con_accessid  = '';
    $close = true;
    // Submit to Jira
    // THIS IS EFFECTIVELY WHERE THE DATA IS SAVED/STORED IN THE DB; this already seems to work okay, so I commented it out
    //test_waiver_submit_jira_ticket($user_accessid, $summary, $platform, $contact_channel, $time_spent, $categories, $comments, $last_con_accessid, $close);
    // Reset values
    $form_state['input']['access_id'] = '';
    $form_state['input']['summary'] = '';
    $form_state['input']['platform'] = null;
    $form_state['input']['contact_channel'] = null;
    $form_state['input']['minutes'] = '';
    $form_state['input']['category'] = null;
}
$form_state['rebuild'] = TRUE;
return $form['form'];
}

// FUNCTIONS BELOW WERE ADDED FOR TESTING

function for_testing()  {
variable_set('test_waiver_platforms', 'Windows' . chr(13) . 'Mac');
variable_set('test_waiver_contact_channels', 'Walk-In' . chr(13) . 'Phone');
}

function _get_services()    {
return array('service 1' => 'service 1', 'service 2' => 'service 2');
}

(I've done my best to remove superfluous/too specific/dependent code, in the event that anyone wants to attempt to run it themselves.)

I can NOT get this to work. I have questions like:

• Should I use '#type' 'button' or 'submit'? The docs aren't very clear on what the real difference between the two are, and I get slightly different behavior with each.
• Should I use an onClick attribute to return false with the button?
• Do I need and additional '#submit' callback to make the change? Or can/should it be done within the ajax callback? (I can't seem to change the $form_state, even when receiving it as a reference.)

Answer 1

You can use webform rather than custom code. Its very easy to use. No coding skill required.

Steps to do

• Install webform and webform ajax module
• Create a webform, add required fields.
• In form setting, Go to Advance setting and enable "available as block".
• Just below that, enable "ajax mode".

You can configure email also in email setting.

Answer 2

Try the below code snipped. It will try to rebuild the form

  $form_state = array('storage' => NULL, 'submitted' => FALSE);
  $form_build_id = $_POST['form_build_id'];
  $form = form_get_cache($form_build_id, $form_state);
  $args = $form['#parameters'];
  $form_id = array_shift($args);
  $form_state['post'] = $form['#post'] = $_POST;
  // Enable the submit/validate handlers to determine whether AHAH-submittted.
  $form_state['ahah_submission'] = TRUE;
  $form['#programmed'] = $form['#redirect'] = FALSE;
  drupal_process_form($form_id, $form, $form_state);
  $form = drupal_rebuild_form($form_id, $form_state, $args, $form_build_id);

Add this code on top of the test_contact_block_form_callback function.