AJAX Form Post not working - php

Question

I've tried at least 3 ways and every time I try to get a form to post using ajax, the page always reloads and nothing is submitted.
It doesn't even return a success or error - it seems that the function isn't even being called.
Here's the code, thanks in advance.
HTML:
<form id='sig_up' name='sig_up' style='min-width:170px'>
<textarea id='sig' class='custom-scroll' style='max-height:180px;'></textarea>
<br>
<input class='btn btn-primary btn-sm' type='submit' />
</form>
jQuery/AJAX:
$('#sig_up').on('submit',function(e) {
$.ajax({
url:'update_sig.php',
data:$(this).serialize(),
type:'POST',
success:function(data){
$.smallBox({
title : "Signature Updated",
content : "Your signature has been successfully updated.",
color : "#296191",
//timeout: 8000,
icon : "fa fa-bell swing animated"
});
},
error:function(data){
}
});
e.preventDefault(); //=== To Avoid Page Refresh and Fire the Event "Click"===
});

Answer 1

Well, to send it I will attach the handler of the the form to the document (although according to the docs it doesn't matter), write the preventDefault first to avoid sending the form before anything (although I tried with it at the end, and the result is exactly the same, have to review this function).
So, the other important thing I did, and I thing is the real answer, is the change of the scope inside of the form. If you used $(this) inside of the AJAX, you're referring to the AJAX jquery handler, instead to the form, I changed it to show how it changes. I also added an error console.log to check what is wrong just in case. I tried the code below and it sends the call in my localhost.
$(document).on('submit', '#sig_up', function(e) {
e.preventDefault();
var $form = $(this);
$.ajax({
url: 'update_sig.php',
data: $form.serialize(),
type: 'POST',
success:function(data){
console.log('ok');
// $.smallBox({
// title : "Signature Updated",
// content : "Your signature has been successfully updated.",
// color : "#296191",
// //timeout: 8000,
// icon : "fa fa-bell swing animated"
// });
},
error:function(data){
console.log(data);
}
});
});

Answer 2

Have you tried it with stopImmediatePropagation() ?
$('#sig_up').on('submit',function(e) {
e.preventDefault();
e.stopImmediatePropagation();
$.ajax({
url: 'update_sig.php',
data: $(this).serialize(),
type: 'POST',
success:function(data){
console.log("Success");
},
error:function(data){
console.error("Error");
}
});
});

Answer 3

$('#sig_up').on('submit',function(e) {
e.preventDefault(); //=== To Avoid Page Refresh and Fire the Event "Click"===
var that = this;
$.ajax({
url:'update_sig.php',
data:$(that).serialize(),
type:'POST',
success:function(data){
$.smallBox({
title : "Signature Updated",
content : "Your signature has been successfully updated.",
color : "#296191",
//timeout: 8000,
icon : "fa fa-bell swing animated"
});
},
error:function(data){
}
});
});