除数据表的第一页外，Ajax调用不起作用

Question

I am trying to increase or decrease seats of a trip via ajax call in a data table. It works fine on the first page. But when I try the same thing on a second or third page of data-table the page reloads and the value remains unchanged. Here is my code:

$(function(){
  $('form#changeSeats').submit(function(e){
    e.preventDefault();

    var formData = new FormData(this);
    $.ajax({
      type: 'POST',
      async: false,
      url: "/backend/deal/increase",
      data: formData,
      success: function(data){
          $("#seats"+data[1]).text(data[0]);
      },
      cache: false,
      contentType: false,
      processData: false
    });
  });
});

</div>

Answer 1

I guess you should remove Self-Invoking Functions i.e. function(){}.

Use this code after calling the Datatable

$('form#changeSeats').submit(function(e){
       e.preventDefault();
           var formData = new FormData(this);
           $.ajax({
                type: 'POST',
                async: false,
                url: "/backend/deal/increase",
                data: formData,
                success: function(data){
                    $("#seats"+data[1]).text(data[0]);
                },
                cache: false,
                contentType: false,
                processData: false
            });
 });