Form Processing via AJAX - Avoiding both GET & POST Requests from getting generated

I am trying to send form data via AJAX. But I see that both GET & POST requests are getting generated.

Here's my form's Submit Handler

 <button id="submit" class="btn">Submit</button>

I have a jQuery handler set up for onClick event. I construct POST request and send it via AJAX.

$(function(){
    $('#submit').click(function() {
        $.ajax({
        ...
        ...
     });
  });
});

I just need to send POST request. How do I stop GET request being generated?

Answers:

Instead of binding to the click of the button, bind to the submit event of the form and prevent the default behavior:

$(function(){
    $('form').on('submit', function(e) {
        e.preventDefault();
        $.ajax({
        ...
        ...
     });
  });
});