Я создал контактную форму, которая должна быть проверена через ajax PHP, а затем отправлена по электронной почте с использованием PHP.
Когда я нажимаю кнопку «Отправить» вместо выполнения сценария PHP и проверки, страница перезагружается с новымстраница:
mypage.com / form_process.php
Кроме того, он не загружает таблицу стилей.
<!DOCTYPE HTML>
<html>
<head>
<title></title>
<script src= "https//ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
</script>
<?php include('form_process.php'); ?>
<link rel="stylesheet" type="text/css" href="form.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<script>
$(document).ready(function) {
$("form").submit(function(event) {
event.preventDefault();
var name = $("name").val();
var email = $("email").val();
var signature = $("signature").val();
$(".form-message").load("form_process.php", {
name: name,
email: email,
signature: signature
});
});
});
</script>
</head>
<body>
<div id="contact-form">
<form method="post" action="form_process.php" method="POST" name="pdf-download">
<div class="podrecieved">
<h3>Recieved by<h3>
</div>
<div class="form-group col-xs-12">
<label for="firstname">Name:</label>
<input type="text" class="form-control" id="name" name="name" placeholder="John Doe">
</div>
<div class="form-group col-xs-12">
<label for="email_id">Email address:</label>
<input type="email_id" class="form-control" id="email" name="email" placeholder="john@company.com">
</div>
<div>
<label for="messages">
<span class="required">Additional Comments:</span>
<textarea id="messages" name="messages" placeholder="Please write your thougths here." tabindex="5"></textarea>
</label>
</div>
<div class="container">
<div class="panel panel-default">
<div class="panel-body">
<div class="row">
<div class="col-sm-12">
<h3>Click to sign</h3>
<input type="text" id="txt" name="signature" style="border-radius: 5px;">
</div>
</div>
</div>
</div>
</div>
<div id="editor"></div>
<button name="submit" type="submit" id="submit">Submit</button>
<p class="form-message"></p>
</form>
</div>
</body>
</html>
form_process.php
<?php
if(isset($_POST['submit'])) {
$name = $_POST['name'];
$email = $_POST['email'];
$signature = $_POST['signature'];
$message = $_POST['messages'];
$company = $_POST['company'];
$ErrorEmpty = false;
$ErrorEmail = false;
if (empty($name) || empty($email) || empty($signature)){
echo "<span class='form-error'>Please fill in required fields</span>";
$ErrorEmpty = true;
}
elseif(!filter_var($email, FILTER_VALIDATE_EMAIL)) {
echo "<span class='form-error'>Please fill in a valid email address</span>";
$ErrorEmail = true;
}
else {
echo "<span class='form-success'>Please fill in a valid email address</span>";
}
}
else{
echo "There was an Error!";
}
$mailto = "contact@email.co.uk";
$headers = "from:".$company;
$txt = "Your Proof of delivery was signed for by:".$name;
mail($mailto, $headers, $txt );
header("location: index.php?POD_sent");
?>
<script>
$("#name, #email, #txt").removeClass(input-error);
var ErrorEmpty = "<?php echo $ErrorEmpty; ?>";
var ErrorEmail = "<?php echo $ErrorEmail; ?>";
if(ErrorEmpty == true) {
$("#name, #email, #txt").addClass("input-error");
}
if(ErrorEmail == true) {
$("#email").addClass("input-error");
}
if(ErrorEmpty == false && ErrorEmail == false) {
$("#name, #email, #txt").val("")
}
</script>
Я не вижу, где я ошибся с этим кодом.Вместо открытия новой ссылки на form_process.php она должна использовать form_process.php для проверки, а затем отправить форму.
Кажется, что form_process.php вызывается, когда я получаю сообщение об ошибке - There was an Error! из строкиelse{
echo "There was an Error!";
}
Итак, я предполагаю, что ошибка исходит из этого листа form_process.php