I form AJAX hanno il problema degli invii multipli. Ciò è dovuto al fatto che spesso l'utente non presta attenzione ai messaggi generati dalla UI o più semplicemente si aspetta un cambiamento nella pagina che di fatto non avviene. jQuery ci offre una semplice soluzione.
La soluzione è la seguente:
$( "#form" ).on( "submit", function( e ) {
e.preventDefault();
var $form = $( this ),
$submit = $form.find( ":submit" ),
data = $form.serialize();
// Impediamo ulteriori click
$submit.val( "Invio in corso..." );
$submit.attr( "disabled", "disabled" );
$.post( "ajax.php", data, function( resp ) {
// Elaborazione della risposta
// Ripristiniamo il pulsante di invio
$submit.val( "Invia" );
$submit.removeAttr( "disabled" );
});
});