PHP form validation with AJAX - php

Question

I'm trying to put my email form to work, but something is wrong.
I'm having no problems receving the email, but the process of ajax script with JSON (validation successful) isn't working properly and i don't know why.
My HTML:
<form id="feedback" method="post" action="">
<div class="enter-data">
<label for="name"><span>Nome:</span></label>
<input name="name" id="name" type="text" class="formbox">
</div>
<div class="enter-data">
<label for="email"><span>E-mail:</span> </label>
<input name="email" id="email" type="text" class="formbox">
</div>
<div class="enter-data">
<label for="telefone"><span>Telefone:</span></label>
<input name="telefone" id="telefone" type="text" class="formbox">
</div>
<div class="enter-commnet">
<label for="comments"></label>
<textarea name="comments" id="comments"></textarea>
</div>
<div class="button_comment-bx">
<button class="button_comment last" name="send" id="send" type="submit">Enviar</button>
<button class="button_comment" name="reset" id="reset" type="reset">Limpar</button>
</div>
</form>
My jquery **
(EDITED)
**:
$(document).ready(function(){
$("#feedback").submit(function(){
$(".error").remove();
var check = true;
var emailPattern = /^[a-zA-Z0-9._-]+#[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;
var name = $("#name").val();
var email = $("#email").val();
var telefone = $("#telefone").val();
// Validate Name
if (name == '') {
check = false;
$('#name').after('<div class="error">* Preencha o seu nome!</div>');
}
else if (name.length < 3) {
check = false;
$('#name').after('<div class="error">* Nome demasiado curto!!</div>');
}
// Validate E-mail
if (email == '') {
check = false;
$('#email').after('<div class="error">* Preencha o seu email!</div>');
}
else if (email.length < 5) {
check = false;
$('#email').after('<div class="error">* Email demasiado curto!</div>');
}
else if(!emailPattern.test(email)){
check = false;
$('#email').after('<div class="error">* E-mail não é válido!</div>');
}
// Validate Telefone
if (telefone == '') {
check = false;
$('#telefone').after('<div class="error">* Preencha o seu telefone!</div>');
}
else if (telefone.length < 5) {
check = false;
$('#telefone').after('<div class="error">* Telefone não é válido!</div>');
}
// If validation is successful
$.ajax({
type: "POST",
url: "contact3.php",
data: $("#feedback").serialize(),
dataType: "json",
success: function(response){
$("#comments").after('<div class="success">Email enviado com sucesso!</div>');
$('#name').val('');
$('#email').val('');
$('#telefone').val('');
$('#comments').val('');
}
});
});
});
My PHP script for sending mail **
(EDITED)
**
<?php
$to ='myemail#email.com';
// Contact subject
$subject ="Contacto Site";
$header="from: $name <$email>";
$nome = $_POST['name'];
$email = $_POST['email'];
$telefone = $_POST['telefone'];
$mensagem = $_POST['comments'];
// Corpo da mensagem
$body = "Nome: ".$nome;
$body.= "\n";
$body.= "Email: ".$email;
$body.= "\n";
$body.= "Telefone: ".$telefone;
$body.= "\n";
$body.= "\n";
$body.= nl2br($mensagem);
// Enter your email address
mail($to,$subject,$body,$header);
echo json_encode(array('mailSuccess' => 1));
help me please!

Answer 1

You are missing return value of your script. You have to echo json_encoded string, which jquery will check in if (!response.mailSuccess)
<?php
$to ='myemail#email.com'; // Contact subject $subject ="Contacto Site";
$header="from: $name <$email>";
$nome = $_POST['name']; $email = $_POST['email']; $telefone = $_POST['telefone']; $mensagem = $_POST['comments'];
// Corpo da mensagem $body = "Nome: ".$nome; $body.= "\n"; $body.= "Email: ".$email; $body.= "\n"; $body.= "Telefone: ".$telefone; $body.= "\n"; $body.= "\n"; $body.= nl2br($mensagem);
// Enter your email address
mail($to,$subject,$body,$header);
echo json_encode(array('mailSuccess' => 1));
?>
EDITED:
$.ajax({
type: "POST",
url: "contact3.php",
data: $("#feedback").serialize(),
dataType: "json",
success: function(response){
$("#comments").after('<div class="success">Email enviado com sucesso!</div>');
$('#name').val('');
$('#email').val('');
$('#telefone').val('');
$('#comments').val('');
}
});