我的网站上有以下联系表格。但是表单数据被附加到URL上,并且json没有被发送到PHP邮件处理程序。以下是我的表格代码。
HTML
<form novalidate="novalidate" style="width:60%;margin-left:auto;margin-right:auto;" onsubmit="sendMailNew()">
<div class="col-md-12">
<div class="col-md-6" style="padding-right: 5px">
<input type="text" class="form-control" name="contact_uname" id="contact_uname" placeholder="NAME" style="width:100%">
</div>
<div class="col-md-6">
<input type="text" class="form-control" name="contact_no" id="contact_no" placeholder="PHONE NUMBER" style="width:100%">
</div>
<div class="col-md-12" style="margin-top: 3%">
<input class="form-control" type="email" name="contact_email" id="contact_email" placeholder="E-MAIL ADDRESS" style="width:100%">
</div>
<div class="col-md-12" style="margin-top: 3%">
<input type="text" class="form-control" name="contact_company" id="contact_company" placeholder="COMPANY" style="width:100%">
</div>
<div class="col-md-12" style="margin-top: 3%">
<input type="text" class="form-control" name="contact_website" id="contact_website" placeholder="EXISTING WEBSITE(if any)" style="width:100%">
</div>
<div class="col-md-12" style="margin-top: 3%">
<input type="text" class="form-control" name="contact_social" id="contact_social" placeholder="WHAT WOULD YOU LIKE(website, social media etc)" style="width:100%">
</div>
<div class="col-md-12" style="margin-top: 3%">
<input type="text" class="form-control" name="contact_budget" id="contact_budget" placeholder="BUDGET(if we know approximately how much you're hoping to spend. we can (hopefully) come up with a strategy that fits your budget.)" style="width:100%">
</div>
<div class="col-md-12" style="margin-top: 3%">
<input type="text" class="form-control" name="contact_section" id="contact_section" placeholder="WHAT SECTION WOULD YOU LIKE ON THE SITE" style="width:100%">
</div>
<div class="col-md-12" style="margin-top: 3%">
<input type="text" class="form-control" name="contact_update" id="contact_update" placeholder="WHICH OF THOSE SECTIONS WILL YOU WANT TO BE ABLE TO UPDATE YOURSELF?" style="width:100%">
</div>
<div class="col-md-12" style="margin-top: 3%">
<input type="text" class="form-control" name="contact_design" id="contact_design" placeholder="ANY IDEA ON THE STYLE OT DESIGN? DO YOU HAVE REFERENCES?" style="width:100%">
</div>
<div class="col-md-12" style="margin-top: 3%">
<input type="text" class="form-control" name="contact_timeline" id="contact_timeline" placeholder="TIMELINE(when do you want to launch?)" style="width:100%">
</div>
<div class="col-md-12" style="margin-top: 3%">
<input type="text" class="form-control" name="contact_hear" id="contact_hear" placeholder="HOW DID YOU HEAR ABOUT US?" style="width:100%">
</div>
<div class="col-md-12" style="margin-top: 3%">
<input type="text" class="form-control" name="contact_comment" id="contact_comment" placeholder="ANY OTHER COMMENTS?" style="width:100%">
</div>
<div class="col-md-12" style="margin-top:3%">
<button type="submit" name="submit" value="submit" style="position:relative;left:45%;color:#22252c !important;background-color:white !important" class="btn btn-default">SUBMIT NOW</button>
</div>
</div>
</form>
AJAX脚本
<script type="text/javascript">
function sendMailNew()
{
$.ajax({
type: 'POST',
url: 'contactmail.php',
data: { cname: $("#contact_uname").val(), cno: $().val("#contact_no"), cemail: $("#contact_email").val(), ccompany: $("#contact_company").val(), cwebsite: $("#contact_website").val(), csocial: $("#contact_social").val(), cbudget: $("#contact_budget").val(), csection: $("#contact_section").val(), cupdate: $("#contact_update").val(), cdesign: $("#contact_design").val(), ctimeline: $("#contact_timeline").val(), chear: $("#contact_hear").val(), ccomment: $("#contact_comment").val() },
async: false,
success: function (data) {
$("#contact_uname").val()=data;
$("#contact_no").val()="";
$("#contact_email").val()="";
$("#contact_company").val()="";
$("#contact_website").val()="";
$("#contact_social").val()="";
$("#contact_budget").val()="";
$("#contact_section").val()="";
$("#contact_update").val()="";
$("#contact_design").val()="";
$("#contact_timeline").val()="";
$("#contact_hear").val()="";
$("#contact_comment").val()="";
},
dataType: 'json',
error: function (e, g, y) {
var msg = e;
}
});
alert('Thanks for submitting the form, we will get back to you soon!');
}
</script>
PHP邮件处理程序
<?php
if(isset($_POST['submit'])){
$to = "pavan@tip.agency";
$from = $_POST['contact_email']; // this is the sender's Email address
$name = $_POST['contact_uname'];
$number = $_POST['contact_no'];
$company = $_POST['contact_company'];
$website = $_POST['contact_website'];
$social = $_POST['contact_social'];
$budget = $_POST['contact_budget'];
$section = $_POST['contact_section'];
$update = $_POST['contact_update'];
$design = $_POST['contact_design'];
$timeline = $_POST['contact_timeline'];
$hear = $_POST['contact_hear'];
$comment = $_POST['contact_comment'];
$subject = "Form submission";
$subject2 = "Copy of your form submission";
$message = "Name:" . $name . "\n Email: " . $from . "\n Number:" . $number . "\n Company:" . $company . "\n Website:" . $website . "\n Social:" . $social . "\n Budget:" . $budget . "\n Section:" . $section . "\n Update:" . $update . "\n Design:" . $design . "\n Timeline:" . $timeline . "\n Hear:" . $hear . "\n Comment:" . $comment;
$headers = "From:" . $from;
mail($to,$subject,$message,$headers);
}
?>
知道如何解决这个问题吗?
提前致谢!!
答案 0 :(得分:0)
首先在javascript中停止默认操作。
<script type="text/javascript">
function sendMailNew()
{
event.preventDefault();
//Your rest of JS here
}
</script>
我不确定,但您可能需要在表单中添加action=""
。如果它解决了,请告诉我们。
答案 1 :(得分:0)
该选项不是类型:&#39; POST&#39;, 这是方法:&#39; POST&#39;。所以默认情况下它应该是一个GET请求。
在PHP脚本中,您从&#34; $ _ POST&#34;中获取值,因此无法找到您的参数。试试吧。我更喜欢使用$ .post,而不是$ .ajax用于我的帖子请求。为了使脚本更好,您应该阻止默认事件,并且可以使用网址将您的数据作为属性操作提交,并使用$(&#39; form&#39;)。attr(&#39; action&#39; )为您的要求。
$.ajax({
method: "POST",
url: "some.php",
data: { name: "John", location: "Boston" }
})
我更喜欢这种方式,它看起来更干净,你不能用提交方法做错事:
function sendMailNew(e)
{
e.preventDefault();
var $form = $('form');
var url = $form.attr('action') || 'contactmail.php';
var params = {
cname: $("#contact_uname").val(),
cno: $().val("#contact_no"),
cemail: $("#contact_email").val(),
ccompany: $("#contact_company").val(),
cwebsite: $("#contact_website").val(),
csocial: $("#contact_social").val(),
cbudget: $("#contact_budget").val(),
csection: $("#contact_section").val(),
cupdate: $("#contact_update").val(),
cdesign: $("#contact_design").val(),
ctimeline: $("#contact_timeline").val(),
chear: $("#contact_hear").val(),
ccomment: $("#contact_comment").val()
};
$.post(url, params, function(data, status) {
$("#contact_uname").val()=data;
$("#contact_no").val()="";
$("#contact_email").val()="";
$("#contact_company").val()="";
$("#contact_website").val()="";
$("#contact_social").val()="";
$("#contact_budget").val()="";
$("#contact_section").val()="";
$("#contact_update").val()="";
$("#contact_design").val()="";
$("#contact_timeline").val()="";
$("#contact_hear").val()="";
$("#contact_comment").val()="";
}, 'json').fail(function() {
alert( "error" );
});
}