Я пробовал так, возможно, разные способы сделать эту работу, но не повезло. Каждый раз, когда я отправляю форму, оповещение об успешном прокачке срабатывает даже на пустых полях.
Это мой HTML
<!-- Content -->
<div class="content">
<form role="form" id="form" action="assets/php/mail.php" method="post">
<div class="row 50%">
<div class="6u 12u(mobile)">
<label for="name"></label>
<input id="name" type="text" name="name" placeholder="Name"/>
<span></span>
</div>
<div class="6u 12u(mobile)">
<label for="email"></label>
<input id="email" type="email" name="email" placeholder="Email"/>
</div>
</div>
<div class="row 50%">
<div class="12u">
<textarea id="message" name="message" placeholder="Message" rows="7"></textarea>
</div>
</div>
<div class="row">
<div class="12u">
<ul class="buttons">
<li><input id="submit-button" type="submit" class="special" value="Send" /></li>
</ul>
</div>
</div>
</form>
</div>
Это JS. Пустой swal I.m, использующий его для очистки формы после отправки, — единственный способ заставить его работать.
$(document).ready(function(){
$('#form').on('submit',function(e) { //Don't foget to change the id form
$.ajax({
url:'assets/php/mail.php', //===PHP file name====
data:$(this).serialize(),
type:'POST',
success:function(data){
console.log(data);
//Success Message == 'Title', 'Message body', Last one leave as it is
swal({
type: 'success',
title: 'Submmited',
text: 'Your message has been send!'
}).then((result) => {
if (result.value) {
$("#name").val("");
$("#email").val("");
$("#message").val("");
swal()
}
});
},
error:function(data){
//Error Message == 'Title', 'Message body', Last one leave as it is
swal({
type: 'error',
title: 'Oops...',
text: 'Something went wrong!',
footer: '<a href>Why do I have this issue?</a>'
})
}
});
e.preventDefault(); //This is to Avoid Page Refresh and Fire the Event "Click"
});
});
Это мой PHP, я использую для этого очень много разных php-кодов, но это тот, который на самом деле лучше всего работает для меня.
$name = strip_tags(trim($_POST["name"]));
$name = str_replace(array("\r","\n"),array(" "," "),$name);
$email = filter_var(trim($_POST["email"]), FILTER_SANITIZE_EMAIL);
$message = trim($_POST["message"]);
// Check the data.
if (empty($name) OR empty($message) OR !filter_var($email, FILTER_VALIDATE_EMAIL)) {
header("Location: ../../contact.html");
exit;
}
$recipient = "[email protected]";
// Set the email subject.
$subject = "New contact from $name";
// Build the email content.
$email_content = "Name: $name\n";
$email_content .= "Email: $email\n\n";
$email_content .= "Message:\n$message\n";
$email_headers = "From: $name <$email>";
mail($recipient, $subject, $email_content, $email_headers);
header("Location: ../../contact.html");
Попробуйте проверить входные данные в submit
обработчик:
$('#form').on('submit',function(e) {
e.preventDefault();
if( $(this).find("[name='name']").val()!="" && // If the 3 aren't empty, it proceeds.
$(this).find("[name='email']").val()!="" &&
$(this).find("[name='message']").text()!=""){
// The rest of your code here...
}else{
alert("Please fill the form before submitting!"); // Or use a swal...
}
});
Об Аяксе: success
обратный вызов срабатывает при успешном восстановлении Ajax независимо от отправляемых данных. error
обратный вызов срабатывает, когда запрос Ajax не может быть выполнен … Например, из-за неправильного URL-адреса или чего-то еще.
Других решений пока нет …