Bootstrap модальная всплывающая форма с кнопками отмены и отправки, независимо от того, какая кнопка нажата, форма отправляет - PullRequest
0 голосов
/ 06 ноября 2019

Я пытаюсь решить проблему с помощью модального всплывающего окна начальной загрузки. У меня есть две кнопки в форме, одна для отмены и одна для отправки формы. Если я нажму на кнопку отмены, форма все еще будет отправлена. Может кто-нибудь увидеть, где я иду не так.

Моя форма

<form  name="DeleteConferenceBooking" id="Conference_Delete" method="post" autocomplete="off"  enctype="multipart/form-data" role="form" data-toggle="validator">
<input name="RecordID" type="text" id="ConfDeleteRecordID">
<button type="button" class="tn btn-warning-edit btn-xs" data-dismiss="modal">Cancel</button>
<button type="submit" class="btn btn-secondary-edit btn-xs submit-button">Continue</button>
</form>

Мой Jquery отправить код

$(document).ready (function () {
  $('#Conference_Delete').on('click', function(e){
    e.preventDefault();
    $('#open_delete_conference_booking_data_modal').toggle();
    var recordid = $('#ConfDeleteRecordID').val();
    console.log("CONFERENCE DELETE RECORDID",recordid);
    var form = this;
    var formData = new FormData(form);
    formData.append("RecordID", recordid);
    $.ajax({
        url: 'conf_bookings_delete.php',
        type: 'POST',
        data: formData,
        cache: false,
        contentType: false,
        processData: false,
        success: function(data){
          var result = JSON.stringify(data); 
          result = JSON.parse(result);
          console.log("RESULT", result);
          $("#open_delete_conference_booking_data_modal").modal('hide');
          $("#open_edit_data_modal").modal('hide');
          $('#userTable').DataTable().ajax.reload();
        }
    }); 
  });   
}); 

Большое спасибо заранее за вашу помощь и время

1 Ответ

1 голос
/ 06 ноября 2019

Изменить событие для отправки вместо клика.

$(document).ready (function () {
  $('#Conference_Delete').on('submit', function(e){
    e.preventDefault();
    $('#open_delete_conference_booking_data_modal').toggle();
    var recordid = $('#ConfDeleteRecordID').val();
    console.log("CONFERENCE DELETE RECORDID",recordid);
    var form = this;
    var formData = new FormData(form);
    formData.append("RecordID", recordid);
    $.ajax({
        url: 'conf_bookings_delete.php',
        type: 'POST',
        data: formData,
        cache: false,
        contentType: false,
        processData: false,
        success: function(data){
          var result = JSON.stringify(data); 
          result = JSON.parse(result);
          console.log("RESULT", result);
          $("#open_delete_conference_booking_data_modal").modal('hide');
          $("#open_edit_data_modal").modal('hide');
          $('#userTable').DataTable().ajax.reload();
        }
    }); 
  });   
}); 
...