Modulo di contatto 7 AJAX Callback

Question

Da tempo si cerca su questo argomento e non si riesce a trovare alcuna documentazione per delineare ciò che voglio ottenere.

sto utilizzando wordpress e il plugin Modulo di contatto 7, tutto funziona alla perfezione, quello che voglio raggiungere è quello di eseguire alcuni particolari javascript sul modulo di presentare, so che possiamo usare "on_sent_ok:" nelle impostazioni aggiuntive, ma questo si esegue solo se il modulo viene effettivamente inviato.

Quello che mi piacerebbe fare è fare qualche altro javascript quando il modulo non invia ok, che riporta l'utente alla sezione che non ha convalidato.

Posso utilizzare il codice seguente per eseguire dopo 1,7 s del modulo di invio che viene fatto clic, tuttavia è un po 'sciatto come se l'utente fosse in esecuzione con una connessione lenta, è possibile che questo possa essere eseguito prima che il modulo sia inviato correttamente.

$('.wpcf7-submit').click(function() { 
setTimeout(function() { 
    if ($('.fs1 input,.fs1 textarea').hasClass('wpcf7-not-valid')) { 
     $('.pop-up-form').removeClass('pustep2').removeClass('pu-closing'); 
     $('.form-step').hide(); 
     $('.fs1').show(); 

    } 
    if ($('.fs2 *').hasClass('wpcf7-not-valid')) { 
     alert('error on page 2 - take user back to the area with issues') 
    } 
}, 1700); 
}); 

C'è qualche funzione particolare o un hook che posso utilizzare per eseguire JS quando il modulo AJAX è stato completato?

Grazie!

Answer 1

Nella versione sono stati introdotti 3,3 nuovi trigger di eventi personalizzati jQuery:

Nuovo: Introdurre 5 nuovo evento jQuery personalizzato innesca

• wpcf7: non valida
• wpcf7: spam
• wpcf7: mailsent
• wpcf7: mailfailed
• wpcf7: presentare

È possibile utilizzare wpcf7:invalid come nell'esempio qui sotto:

$(".wpcf7").on('wpcf7:invalid', function(event){ 
    // Your code here 
}); 

Answer 2

A volte non può funzionare, come Martin Klasson sottolineato, solo 'submit' evento funziona, più probabile perché è innescato da una forma e bolle fino all'oggetto selezionato. Inoltre, come posso capire, ora gli eventi hanno altri nomi, come "invalid.wpcf7", "mailsent.wpcf7", ecc In breve, questo dovrebbe funzionare:

jQuery('.wpcf7').on('invalid.wpcf7', function(e) { 
    // your code here 
}); 

spiegazione più dettagliata qui: How to add additional settings on error in Contact form 7?

Answer 3

Data la varietà di risposte su questo argomento, lo sviluppatore del plugin sembra cambiare idea su come dovrebbe funzionare ogni 5 minuti. Attualmente (Q1 2017) questo è il metodo di lavoro:

document.addEventListener('wpcf7mailsent', function(event) { 
    alert("Fire!"); 
}, false); 

E gli eventi validi sono:

• wpcf7invalid - Incendi quando un modulo di presentazione Ajax ha portato a termine con successo , ma la posta non ha stato inviato perché ci sono campi con l'input non valido .
• wpcf7spam - Gli incendi quando un modulo di presentazione Ajax ha completato con successo, ma la posta non è stato inviato perché è stata rilevata una possibile attività spam.
• wpcf7mailsent - Gli incendi quando un Ajax modulo di presentazione è stata completata con successo, e mail è stata inviata.
• wpcf7mailfailed - Incendi quando un modulo di presentazione Ajax ha portato a termine con successo , ma ha fallito in invio della posta.
• wpcf7submit - Gli incendi quando un modulo di presentazione Ajax ha completato con successo, a prescindere di altri incidenti.

Salsa: https://contactform7.com/dom-events/