我正在尝试与Ajax,php和Jquery为我上一个研究项目(带有mvc架构的php(制作联系表格。我对此有一些疑问:
- 我的联系表格没问题:我收到电子邮件!但是即使我使用该
$.ajax()
,我也不确定这是否真的是 Ajax 请求,因为在我的终端中没有 XHR 请求...... - 我想在发送电子邮件时显示一条消息,例如"感谢您的消息",但该消息仅显示一秒钟,并且页面被重新编辑,因此所有信息都被清理。我尝试使用
e.preventDefault()
但是当我使用它时,我没有收到电子邮件。
感谢您的回答,您提供了帮助。
连续视图:
<section class="form_container">
<form class="contact_form" id="contact_form" method="post" action="index.php?action=contact">
<input class="firstname form" type="text" name="firstname" placeholder="Nom" id="firstname" required>
<span class="error-message"></span><br/>
<input class="lastname form" type="text" name="lastname" placeholder="Prénom" id="lastname" required>
<span class="error-message"></span><br/>
<input class="email form" type="text" name="email" placeholder="Email" id="email" required>
<span class="error-message"></span><br/>
<input class="object form" type="text" name="object" placeholder="Objet" id="object" required>
<span class="error-message"></span><br/>
<textarea class="content form" name="content" placeholder="Votre message" id="content" cols="30" rows="10" required></textarea>
<span class="error-message"></span><br/>
<input class="envoyer form" type="submit" name="submit" value="Envoyer" id="submit"><br/>
</form>
<div id="msg-ok">Merci. Votre message a bien été envoyé.</div>
<div id="msg-notok">Merci de renseigner correctement tous les champs .</div>
</section>
contact_form.js:
// send messages with Ajax
'use strict';
$('#contact_form').submit(function() {
nom = $(this).find("#firstname").val();
prenom = $(this).find("#lastname").val();
email = $(this).find("#email").val();
object = $(this).find("#object").val();
message = $(this).find("#content").val();
$.ajax({
type: "POST",
data: {
nom:nom,
prenom:prenom,
email:email,
object:object,
content:content
},
url: 'http://www.projet-5.pauline-superweb.com/index.php?action=contact',
success: function(data) {
$("#contact_form").hide();
$('#msg-ok').fadeIn();
},
error: function() {
$('#msg-notok').fadeIn();
}
})
});
});
我的控制器中的 PHP 代码:
function contact()
{
if (isset($_POST['submit'])) {
$e = array();
$e['error'] = "Formulaire non valide";
if(isset($_POST['firstname']) && isset($_POST['lastname']) && isset($_POST['object']) && isset($_POST['content']) && !filter_var($_POST['email'], FILTER_VALIDATE_EMAIL)) {
$e['email_invalide'] = "email_invalide";
} else {
$e['error'] = 'Ok';
$nom = $_POST['firstname'];
$prenom = $_POST['lastname'];
$email = $_POST['email'];
$object = $_POST['object'];
$content = $_POST['content'];
$to = 'contact.super.web@gmail.com';
$sujet = $object;
$message = $content;
$headers = 'From ' . $nom . ' ' . $prenom . ' ' . $email;
mail($to, $sujet, $message, $headers);
}
}
ob_start();
include('views/frontend/site/contactView.php');
$content = ob_get_clean();
require("views/frontend/site/template.php");
}
更改此设置
<input class="envoyer form" type="submit" name="submit" value="Envoyer" id="submit">
自
<input class="envoyer form" type="button" name="submit" value="Envoyer" id="submit">
和改变
$('#contact_form').submit(function() {
to
$('#submit').click(function() {