I'm facing problem with my popup ajax contact form because it have only one close event...
My AJAX contact form have two buttons SEND and CANCEL. When i use SEND button the Sweet alert confirmation show correct message. But when i close the window by button CANCEL or click outside the window or use X button on the corner the same confirmation message is showing and this is problem
My js code
$('#button').fancybox({
'hideOnContentClick': false,
'afterClose' : function(){
swal({
title: 'Thanks dude!',
text: 'You are awesome!',
type: 'success',
showConfirmButton: false,
timer: '5000'
});
}
});
My ajax call
$.ajax({
url: "ajax_form.php",
post: "POST",
data: $('#contact').serialize(),
dataType: "json"
}); $.fancybox.close();
So when someone hit SEND button $.fancybox.close(); will close the window and Sweet Alert give nice info with great success. How to add or disable Sweet Alert confirmation when someone use CANCEL button or use other close action?
Thinking in another way to close it, you can try adding a common class or something to the CANCEL, X button and the parent element outside the fancybox. Then with jQuery (or JS), you can define a function that closes it and avoid the ajax call. For example, add a common class class="preventAjax"
. Then with jQuery:
$('.preventAjax').click(function() {$.fancybox.close();});
Other than that, you can close it with Css, but I recommend closing it with the commands that the API provides.
Hope that helps!