Во-первых, обратите внимание что массива data в Вашем коде не существует
var_dump($_POST['data']);
Во-вторых, лучше воспользуйтесь плагином
jquery.form.js
Тогда Ваш код будет таким:
<form action="mail_handler.php" id="feedback-form-call-request" class="feedback-form" method="POST">
<div id="output"></div>
$(function() {
$("#feedback-form-call-request").on("submit", function(e) {
e.preventDefault();
$(this).ajaxSubmit({
dataType: "json", // "html",
beforeSubmit: function() {
// скрываем старые сообщения об ошибках перед отправкой формы
},
success: function(resp) {
// показываем ошибки или сообщение об успешной отправке
}
});
});
});
В-третьих, лучше чтобы обработчик возвращал не html код, а json-объект.
// различные правила валидации
if () {
$result = ['error' => 0, 'msg' => 'Объект успешно сохранен.'];
} else {
$result = ['error' => 1, 'msg' => 'Исправьте ошибку: заполните поле такое-то.'];
}
echo json_encode($result);
Тогда вы можете кастомизировать сообщения и отдельные события в обработчике.
success: function(resp) {
// показываем ошибки или сообщение об успешной отправке
if (resp.error == 0) {
$("#output").attr("class", "alert alert-success").html(resp.msg);
} else {
$("#output").attr("class", "alert alert-danger").html(resp.msg);
}
}