jQuery/PHP ajax联系人表单
jQuery/PHP ajax contact form
我一直在与这个问题作斗争,搜索问题,教程和论坛,但没有找到一个有效的解决方案。我对PHP还是个新手,刚刚开始学习。
正在进行的页面可以在这里找到:http://williamsfuller.com/limedropdesign/
目标:使用jQuery Validate (http://jqueryvalidation.org/)进行前端验证,如果验证成功,则在submitHandler中运行对php文件的ajax调用,该文件接受表单值并将其发送到服务器。在ajax上。Done函数清除表单并显示提交已成功。
我使用ajax的原因是因为我不希望页面刷新并将用户发送回页面顶部。
这是一个单页的作品集,如果我要在表单上做一个post方法,它会破坏重新加载页面的体验。迄今为止我所取得的成就:-我有jQuery验证工作-如果验证成功,ajax调用正确运行,激活联系人表单提交文件-阿贾克斯。使用Done函数时,联系人表单将清空,并显示一条成功消息,告诉用户消息已发送在php方面,我能够硬编码一个邮件函数,它告诉我ajax调用正在工作,php文件正在工作。
<?php
mail('email@gmail.com', 'Mail from Lime Drop Design', 'some body content for the email ');
?>
我卡住的地方是采取jQuery值,并把它们放入一个工作if($_POST){},并有发送电子邮件。
我在表单中也有一个蜜罐来捕捉一些机器人,如果所有的信息都被验证并且主题字段仍然填写,我正在寻找只是允许POST死亡
HTML:<form id="contactForm" method="get" action="">
<div class="form-group">
<input class="form-control"
type="text"
name="name"
id="name"
minlength="2"
placeholder="Name" required>
</div>
<div class="form-group">
<input class="form-control"
type="email"
name="email"
id="email"
placeholder="Your email address" required>
</div>
<div class="form-group">
<textarea class="form-control contactMessage"
name="message"
id="message"
rows="8"
minlength="10"
placeholder="Enter a message" required></textarea>
</div>
<input type="text" id="subject" name="subject" autocomplete="off">
<div class="form-actions">
<input type="hidden" name="save" value="contact">
<button id="formSubmit" type="submit" class="btn contact-btn pull-right">Send</button>
</div>
<div id="result">
Thank you, your message has been sent to Liz!
</div>
</form>
JavaScript: $(document).ready(function(){
$('#result').hide();
$.validator.setDefaults({
submitHandler: function() {
var nameValue = $('#name').val();
var emailValue = $('#email').val();
var messageValue = $('#message').val();
console.log(nameValue, emailValue, messageValue);
$.ajax({
type: "GET",
url: "contactSubmission.php",
data: {
name: $('#name').val(),
email: $('#email').val(),
message: $('#messageValue').val()
}
}).done(function(){
$('#contactForm').find("input[type=text], input[type=email], textarea").val("");
$('#result').slideDown();
});
}
});
$("#contactForm").validate();
)};
PHP工作:<?php
mail('email@gmail.com', 'Mail from Lime Drop Design', 'some body content for the email outisde post function');
?>
PHP不工作(我想实现的):
<?php
if($_POST){
$to = 'email@gmail.com';
$subject = 'Contact Form Submission';
$message = $_POST['messageValue'];
if($_POST['subject'] != ''){
die();
}
//Sanitize input data using PHP filter_var().
$nameValue = filter_var($_POST["nameValue"], FILTER_SANITIZE_STRING);
$emailValue = filter_var($_POST["emailValue"], FILTER_SANITIZE_EMAIL);
$messageValue = filter_var($_POST["messageValue"], FILTER_SANITIZE_STRING);
mail($to, $subject, $message);
}
?>
如果有任何帮助,我将不胜感激。我一直试图让这个工作一段时间了,我似乎只是停留在php POST在这一点上。提前感谢任何输入或工作示例。
正如所指出的,您正在使用Jquery发出GET请求,而php期望发出POST请求。
然后在你的php中,post字段不太好:你把'Value' post字段:$_POST["nameValue"]
,而在Jquery似乎字段被命名为name
,尝试改变$_POST["nameValue"]
为$_POST["name"]
,并做同样的消息和电子邮件。
编辑:改变$('#messageValue').val()
到$('#message').val()
在你的Jquery代码中的post数据,这个值是为什么数据没有成功发送到PHP的原因,在你的console.log你已经把正确的ID,但不是在post数据,这就是为什么你在哪里认为正确的值是由PHP发送的
- 在验证和发送邮件后更改联系人表单的 html
- 在联系人表单中实现jQueryAJAX
- jquery.validator和一个页面上的两个联系人表单将在提交时验证空表单
- PHP&jQuery联系人表单错误
- Javascript按钮,它提交联系人表单7表单,然后重定向到URL
- 我正在验证一个联系人表单.我是不是过滤太多了
- 防止联系人表单在提交后消失
- PHP Angular JS联系人表单将't张贴
- 如何在联系人表单7 Wordpress中添加自定义javascript函数
- 如何使javascript联系人表单正确提交
- 在联系人表单中显示隐藏警告被延迟
- 基于AJAX的联系人表单7事件跟踪新的谷歌分析代码
- 映射的联系人表单在Jquery-1.11中无法正常工作
- 激活联系人表单上的输入字段需要在手机上点击2次
- 始终显示联系人表单中的问题成功消息
- HTML5,CSS3,PHP联系人表单不发送信息+添加必填字段
- 联系人表单-提交按钮不起作用
- 如何使用JS清理联系人表单后删除HTML5表单验证
- 联系人表单变量不会从部分标签传递到 javascript 中
- 如何在 html 弹出窗口中显示联系人表单