Hi,

Bootstrap jQuery ajax form: Une petite astuce pour envoyer tous les formulaires en ajax par défaut (même les forms dans les widgets de wordpress).

Il suffit juste de renseigner la méthode d’envoie (method) et la destination (action) et ce petit bout de script en jQuery se chergera d’envoyer les données en ajax directement à la page de traitement des formulaires.

    jQuery(function($) {
        $('form').live('submit', function(event) {
            var $form = $(this);
            var $parentdiv = $(this).parent();

            $.ajax({
                type: $form.attr('method'),
                url: $form.attr('action'),
                data: $form.serialize(),

                success: function(data, status) {
                    if(data == 1)
                        $parentdiv.empty().html('<div class="alert alert-block alert-success"><button type="button" class="close" data-dismiss="alert">&times;</button><h4>Votre demande a été enregistré avec succès!</h4> Nous prendrons contact avec vous dans les plus brefs délais.</div>');
                    else
                        $parentdiv.append('<div class="alert alert-block alert-error"><button type="button" class="close" data-dismiss="alert">&times;</button><h4>Attention!</h4>Un problème a été détecté. Prière de reessayer ultérieurement.</div>');
                }
            });
            event.preventDefault();
        });
    });

 


Merci d'évaluer l'article: Bootstrap jQuery ajax form

Score: 4.9 sur 5 Sur un total de 10 avis


Catégorie: bootstrap, Développement frontend, Developpement web, Diverses Astuces, jQuery, Prestashop, wordpress.