Блог

Вызов Ajax работает без использования подтверждения оповещения. но когда я добавил подтверждение предупреждения, вызов ajax не ответил, и я не знаю, в чем проблема.

 <link rel="stylesheet" href="jquery-confirm.min.css">
<script src="jquery-confirm.min.js"></script>
<form id="add-offer">
  <input type="number" name="offer" class="form-control price_offered" value="" step="any">
  <button class="btn btn-primary" type="submit"> Add offer   </button>
</form>
 

 $("#add-offer").on('submit', function(e) {
  e.preventDefault();

  $.alert({
    title: 'Confirmation ',
    content: ' Are you sure.... bla bla bla? ',
    rtl: true,
    closeIcon: true,
    buttons: {
      confirm: {
        text: 'Confirm ',
        btnClass: 'btn-blue',
        action: function() {
          $.ajax({
            type: 'POST',
            url: 'ajax/add-offer.php',
            data: new FormData(this),
            dataType: 'json',
            contentType: false,
            cache: false,
            processData: false,
            beforeSend: function() {},
            success: function(response) {
              console.log(response);
              if (response.success == 1) {
                alert(response.message);
              } else {
                alert(response.message);
              }
            }
          });
        }
      },
      cancel: {
        text: 'Cancel ',
        action: function() {}
      }
    }
  });
});
 

Это может быть проблемой с контекстом функционального блока. Вы можете установить переменную data для получения в e.target качестве параметра данных формы и попробовать. Проверьте приведенный ниже код:

 $("#add-offer").on('submit', function(e) {
  e.preventDefault();
  
  $.alert({
    title: 'Confirmation ',
    content: ' Are you sure.... bla bla bla? ',
    rtl: true,
    closeIcon: true,
    buttons: {
      confirm: {
        text: 'Confirm ',
        btnClass: 'btn-blue',
        action: function() {
          $.ajax({
            type: 'POST',
            url: 'ajax/add-offer.php',
            data: new FormData(e.target),
            dataType: 'json',
            contentType: false,
            cache: false,
            processData: false,
            beforeSend: function() {},
            success: function(response) {
              console.log(response);
              if (response.success == 1) {
                alert(response.message);
              } else {
                alert(response.message);
              }
            }
          });
        }
      },
      cancel: {
        text: 'Cancel ',
        action: function() {}
      }
    }
  });
}); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.4/jquery-confirm.min.js"></script>

<link rel="stylesheet" href="jquery-confirm.min.css">
<script src="jquery-confirm.min.js"></script>
<form id="add-offer">
  <input type="number" name="offer" class="form-control price_offered" value="" step="any">
  <button class="btn btn-primary" type="submit"> Add offer   </button>
</form> 

Заменить $.alert({ на alert({

См. jsfiddle.net/msteel9999/eyk0q37d/3