Fiz a implementação de um código para validação de formulário, porém ao clicar em enviar, ele redireciona para uma página em branco com a mensagem de sucesso e o correto seria aparecer uma mensagem de alert-sucess
HTML
< blockquote >
<div class="messages"></div>
<div class="controls">
<div class="form-group">
<label for="form_name"></label>
<div class="input-group">
<div class="input-group-addon"><i class="fa fa-user"></i></div>
<input id="form_name" type="text" name="name" class="form-control" placeholder="André Jorge Jr" required="required" data-error="Faltou você preencher seu nome">
<div class="help-block with-errors"></div>
</div>
</div>
<div class="form-group">
<label for="form_email"></label>
<div class="input-group">
<div class="input-group-addon"><i class="fa fa-envelope"></i></div>
<input id="form_email" type="email" name="email" class="form-control" placeholder="iajr1992@gmail.com" required="required" data-error="Coloque um e-mail válido">
<div class="help-block with-errors"></div>
</div>
</div>
<div class="form-group">
<label for="form_phone"></label>
<div class="input-group">
<div class="input-group-addon"><i class="fa fa-mobile-phone"></i></div>
<input id="form_phone" type="tel" name="phone" class="form-control" placeholder="(Opcional)">
<div class="help-block with-errors"></div>
</div>
</div>
<div class="form-group">
<label for="form_message"></label>
<textarea id="form_message" name="message" class="form-control" placeholder="Deixe aqui sua dúvida, ideia ou problema. Juntos nós podemos fazer sua ideia se transformar." rows="4" required="required" data-error="Você esqueceu de deixar uma mensagem pra mim."></textarea>
<div class="help-block with-errors"></div>
</div>
<div class="form-group">
<input type="submit" class="btn btn-contato btn-default btn-send" value="Enviar Mensagem">
</div>
</div>
</form>
Código PHP
<?php// configure
$from = ‘Mensagem [via site] marketing@andrejorgejr.com.br’;
$sendTo = ‘André Jorge Jr marketing@andrejorgejr.com.br’;
$subject = ‘Nova mensagem’;
$fields = array(‘name’ => ‘Name’, ‘surname’ => ‘Surname’, ‘phone’ => ‘Phone’, ‘email’ => ‘Email’, ‘message’ => ‘Message’); // array variable name => Text to appear in email
$okMessage = ‘Muito Obrigado pelo contato, sua mensagem foi enviada com sucesso!’;
$errorMessage = ‘Alguma coisa está errada, verifique os campos e envie novamente’;// let’s do the sending
try
{
$emailText = “Você tem uma nova mensagem\n=============================\n”;foreach ($_POST as $key => $value) { if (isset($fields[$key])) { $emailText .= "$fields[$key]: $value\n"; } } mail($sendTo, $subject, $emailText, "From: " . $from); $responseArray = array('type' => 'success', 'message' => $okMessage);
}
catch (\Exception $e)
{
$responseArray = array(‘type’ => ‘danger’, ‘message’ => $errorMessage);
}if (!empty($_SERVER[‘HTTP_X_REQUESTED_WITH’]) && strtolower($_SERVER[‘HTTP_X_REQUESTED_WITH’]) == ‘xmlhttprequest’) {
$encoded = json_encode($responseArray);header('Content-Type: application/json'); echo $encoded;
}
else {
echo $responseArray[‘message’];
}
Código JS
$(function () {$('#contact-form').validator(); $('#contact-form').on('submit', function (e) { if (!e.isDefaultPrevented()) { var url = "contact.php"; $.ajax({ type: "POST", url: url, data: $(this).serialize(), success: function (data) { var messageAlert = 'alert-' + data.type; var messageText = data.message; var alertBox = '<div class="alert ' + messageAlert + ' alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>' + messageText + '</div>'; if (messageAlert && messageText) { $('#contact-form').find('.messages').html(alertBox); $('#contact-form')[0].reset(); } } }); return false; } })
});