jQuery and Bootstrap don't let me use AJAX

Question

I have form that is posted through AJAX. If I don't use any other JavaScript libraries it works like a charm.

Now I'm using Bootstrap and jQuery and it won't fire.

The code:

$(function() {
    $('form').on('submit', function(e) {
        $.ajax({
            type: 'post',
            url: 'ajax-post.php',
            data: $(this).serialize(),
            alert($(this).serialize());
            success: function() {
                $(".alert").show(0).delay(2000).hide(0);
            }
        });
        e.preventDefault();
    });
});

also put your preventDefault at the very beginning of you form submit function .. https://api.jquery.com/event.preventdefault/ . And you need to handle if the ajax post was NOT a success using the error: function (http://stackoverflow.com/questions/555315/jquery-checking-success-of-ajax-post) — DTH, Apr 29 '16 at 08:25

score 6 · Accepted Answer · answered Apr 29 '16 at 07:55

You can not put alert between two properties data and success, remove alert():

$('form').on('submit', function (e) {
                $.ajax({
                  type: 'post',
                  url: 'ajax-post.php',
                  data: $(this).serialize(),
                  success: function () {

            $(".alert").show(0).delay(2000).hide(0);

                  }
          });
         e.preventDefault();
     });

jQuery and Bootstrap don't let me use AJAX

1 Answers1