I have a form that I send to a function with $.ajax
that I submit by submit, this works fine. The problem is that I have a button that makes a back () to return to the page and when I click on this button this function $.ajax
is executed as if I clicked on submit
. How do I resolve this issue?
Ajax function for submitting the form
$('#formEditCatProduto').submit(function (e) {
e.preventDefault();
var dados = $(this).serialize();
//var dados = new FormData($('#formAddEmpresa').get(0));
$('#btnEditarCatProd').prop('disabled', true);
$('#btnCancelar').prop('disabled', true);
$("#errorMessage").hide();
var loading = $(".imageLoading");
$(document).ajaxStart(function () {
loading.show();
});
$(document).ajaxStop(function () {
loading.hide();
});
$.ajax({
accepts: { json: 'application/json' },
dataType: 'json',
type: "POST",
url: "/CategoriaProduto/editAjax",
data: dados,
success: function (data) {
var status = data["status"];
var msg = data["msg"];
if (status === "1") {
$("#errorMessage").html(msg);
$("#errorMessage").prop("class", "alert-success");
window.location.replace("/CategoriaProduto/view");
} else {
$('#btnEditarCatProd').prop('disabled', false);
$("#errorMessage").html(msg);
$("#errorMessage").prop("class", "alert-danger");
}
$("#errorMessage").show()
},
error: function (xhr, status) {
$("#btnEditarCatProd").prop("disabled", false);
$("#btnCancelar").prop("disabled", false);
$("#errorMessage").html("Erro tentando editar categoria de produto :(");
$("#errorMessage").prop("class", "alert-danger");
$("#errorMessage").show()
}
});
});
Buttons
<div class="pull-right">
<input type="submit" class="btn btn-warning" id="btnEditarCatProd" value="Gravar" />
<button id="btnCancelar" class="btn btn-danger" onclick="window.history.back()">Cancelar</button>
</div>