Come convalidare e inviare un modulo utilizzando AJAX?

Ho creato un modulo web utilizzando l'API del modulo. Sto usando l' #AJAXopzione field per aggiungere la convalida AJAX a ciascun campo.

È possibile convalidare e inviare il modulo utilizzando AJAX senza ricaricare la pagina. Se la validazione fallisce, voglio mostrare un messaggio di errore e se la validazione ha successo, allora voglio mostrare un messaggio (idealmente in una lightbox) e resettare i campi del modulo.

Il mio codice finora:

$form['name'] = array(
    '#type' => 'textfield',
    '#title' => t('Name'),
    '#default_value' => '',
    '#maxlength' => '128',
    '#required' => TRUE,
    '#ajax' => array(
        'callback' => '_validate_name',
        'wrapper' => 'name-error-icon-container',
        'method' => 'html',
        'effect' => 'none',
        'progress' => array(
            'message' => NULL,
        ),
    ),
);

$form['submit'] = array(
    '#type' => 'submit',
    '#value' => 'Submit',
    '#ajax' => array(
        'callback' => '_handle_form_submit',
        'effect' => 'fade',
    ),
);

le funzioni di callback si presentano così:

function _validate_name($form, $form_state) {

    if ($form_state['values']['name'] != '') {
    $output = 'OK';
    }
    else {
      $output = 'Enter a value';
    }

   return $output;

}

function _handle_form_submit($form, $form_state) {
}

Ma non sono sicuro di cosa dovrebbe andare nella _handle_form_submitfunzione per convalidare e quindi restituire un messaggio o inviare un modulo e ripristinare i campi?

Il modulo degli esempi ha una forma ajax a cui puoi fare riferimento e molte altre. Ecco un link all'esempio del modulo ajax nel repository di codice, ma suggerisco di scaricare per guardare l'implementazione da soli.

So che questa domanda è in sospeso da un paio d'anni ormai, ma non credo che nessuna delle altre risposte abbia davvero il punto di sottomissione del modulo ajax di Drupal 7, quindi proverò a spiegarlo.

Sinve il tuo modulo dovrebbe funzionare anche senza l'ajax secondo le buone pratiche, il tuo gestore di invio ajax non dovrebbe fare altro che restituire il modulo. Tutto il resto dovrebbe essere nella tua convalida e inviare funzioni.

function ex_form($form, $form_state) {
  $form['name'] = array(
    '#type' => 'textfield',
     '#title' => t('Name'),
     '#default_value' => '',
     '#maxlength' => '128',
     '#required' => TRUE,
  );

  $form['submit'] = array(
   '#type' => 'submit',
   '#value' => 'Submit',
   '#ajax' => array(
     'callback' => 'ex_form_ajax_handler',
     'effect' => 'fade',
   ),
  );
}

function ex_form_submit(&$form, &$form_state) {
  // Submit logic - runs when validation is ok
  // You can alter the form here to be just a markup field if you want.
}

function ex_form_validate(&$form, &$form_state) {
  // Validation logic - invalidate using form_set_error() or form_error()
}

function ex_form_ajax_handler(&$form, &$form_state) {
  return $form;
}

Penso che il post di maxtorete del 17 ottobre 2011 sembra dare un esempio più completo usando sia form_validate()e cheform_submit()

(Non l'ho ancora testato.)

Anche la risposta di Joshua Stewardson allo overflow dello stack ha un buon esempio funzionante:

function dr_search_test_form($form, &$fstate) {

  $form['wrapper'] = [
    '#markup' => '<div id="test-ajax"></div>',
  ];

  $form['name'] = [
    '#type'     => 'textfield',
    '#required' => TRUE,
    '#title'    => 'Name',
  ];

  $form['submit'] = [
    '#type'  => 'submit',
    '#value' => 'Send',
    '#ajax'  => [
      'callback' => 'dr_search_test_form_callback',
      'wrapper'  => 'test-ajax',
      'effect'   => 'fade',
    ],
  ];

  return $form;
}

function dr_search_test_form_callback($form, &$fstate) {

  return '<div id="test-ajax">Wrapper Div</div>';
}

function dr_search_test_form_validate($form, &$fstate) {

  form_set_error('name', 'Some error to display.');
}

Joshua sottolinea che i messaggi di errore di convalida sostituiscono #ajax['wrapper']completamente l' elemento, quindi il callback deve rifornire di nuovo questo elemento quando lo si sostituisce.

In generale, la convalida e la gestione dell'invio dei moduli dovrebbero avvenire nei soliti callback _validate () e _submit (). L'idea è che le forme dovrebbero ancora funzionare senza ajax.

Praticamente l'unica cosa che i callback #ajax dovrebbero fare è restituire la parte del modulo che dovrebbe essere sostituita, secondo il wrapper definito.

Ci sono due modi

1)

function abc_form_validate(&$form, &$form_state) {
  // Validation logic - invalidate using form_set_error() or form_error()
}

function abc_form_ajax_handler(&$form, &$form_state) {
  return $form;
}

2) Modulo di esempio http://cgit.drupalcode.org/examples/tree/ajax_example/ajax_example.module?id=refs/heads;id2=7.x-1.x#l402

Nel mio caso, utilizzando un submittipo di causato il modulo per presentare sempre, quindi l'ho cambiato a una buttoncon #ajaxspecificato. Quindi, ho dovuto fare la mia convalida nel callback ajax.

Stavo realizzando un riquadro ctools; Non so se ci gioca.

function mymodule_form($form, &$form_state) {
  ...
  $form['button'] = array(
    '#type' => 'button',
    '#value' => t('Subscribe'),
    '#ajax' => array(
      'callback' => '_mymodule_ajax',
    ),
  );
  return $form;
}

function _mymodule_ajax($form, &$form_state) {
  if ( ! valid_email_address($form_state['values']['email']) ) {
    form_set_error($form, t('Please enter a valid email address.'));
  } else {
    $form = array(
      '#markup' => t('You have subscribed.'),
    );
  }
  return $form;
}