Estoy usando Sweetalert2 con una llamada Ajax.
Solo quiero mostrar el mensaje de error después de hacer clic en Aceptar.
Actualmente, al hacer clic en CANCELAR o fuera del modal, aún realizará la llamada Ajax (y mostrará el error).
$(function() { $('.user-details').click(function(e) { e.preventDefault(); Swal.fire({ title: 'Are you sure?', text: '', icon: 'question', showCancelButton: true, showLoaderOnConfirm: true, reverseButtons: true, preConfirm: function() { console.log('AJAX request'); return new Promise(function(resolve, reject) { setTimeout(function() { resolve(); }, 1200); }); }, }).then(function() { Swal.fire({ title: 'Error!', text: 'I want to show this, only after clicking OK!', icon: 'error', showCancelButton: false, showLoaderOnConfirm: false, }); }); }); }); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script> <button class='btn btn-success user-details'>View Details</button>Al hacer clic en cancelar o fuera del modal, quiero que se cancele sin el mensaje de "error".
Prueba esto
Swal.fire({ title: 'titulo', text: 'text', icon: 'warning', showCancelButton: true, cancelButtonText: 'Cancelar', confirmButtonColor: '#00CC00', cancelButtonColor: '#999999', confirmButtonText: 'Si, Eliminar', reverseButtons: true, }).then((result) => { if (result.isConfirmed) { $.ajax({ type: 'POST', //or GET url: 'url', data: { id: id }, success: (data, status, xhr) => { console.log(status); }, error: (xhr, status, error) => { console.log('xhr', xhr); console.log('status', status); console.log('error', error); }, dataType: 'json', }); } });