Question

我正在尝试创建一个结果通过电子邮件发送给我的ajax联系表单。我在网上找到了一个表格演示并编辑它以符合我的标准，除了演示中没有复选框，当我添加复选框时除了那些工作。

有人可以指导我完成这个吗？

html是：

    <div class="done">
<strong>Thank you !</strong> We've received your questions and someone from our office will respond at our earliest convience.</p>
<p>Check your email, we just sent you a coupon for 10% off your first purchase.</p>
</div>
    <div class="form">
<form method="post" action="process2.php" autocomplete="off">
<label for="name">Name</label>
<input type="text" name="name" id="name" />
<label for="phone">Phone</label>
<input type="text" name="phone" id="phone" />
<label for="email">Email</label>
<input type="text" name="email" id="email" />
<ul>
<li>Design:</li>
<li><label for="master_plan"><input type="checkbox" name="service[]" id="master_plan" value="Master Plan" /> Master Plan</label></li>
<li><label for="front_foundation"><input type="checkbox" name="service[]" id="front_foundation" value="Front Foundation" /> Front Foundation</label></li>
<li><label for="backyard_plan"><input type="checkbox" name="service[]" id="backyard_plan" value="Backyard Plan" /> Backyard Plan</label></li>
<li><label for="specialty_garden"><input type="checkbox" name="service[]" id="specialty_garden" value="Specialty Garden" /> Specialty Garden</label></li>
</ul>
<label for="newsletter"><input type="checkbox" name="newsletter" id="newsletter" value="x" checked="checked" /> Yes, I would like to be added to your newsletter list.</label>
<label for="comments">Comments</label>
<textarea name="comments" id="comments" rows="5" cols="40" /></textarea>
<input type="submit" id="submit" value="Sign Up" />
<div class="loading"></div>
</form>
</div>

javascript是：

    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#submit').click(function () {
var name = $('input[name=name]');
var phone = $('input[name=phone]');
var email = $('input[name=email]');
var comments = $('textarea[name=comments]');
if (name.val()=='') {
name.addClass('hightlight');
return false;
} else name.removeClass('hightlight');
if (email.val()=='') {
email.addClass('hightlight');
return false;
} else email.removeClass('hightlight');
var data =
'name=' + name.val() +
'&phone=' + phone.val() +
'&email=' + email.val() +
'&comments=' + encodeURIComponent(comments.val());
$('.text').attr('disabled','true');
$('.loading').show();
$.ajax({
url: "process2.php",
type: "GET",
data: data,
cache: false,
success: function (html) {
     if (html==1) {
     $('.form').fadeOut('slow');
     $('.done').fadeIn('slow');
     } else alert('Sorry, unexpected error. Please try again later.');
}
});
return false;
});
});
</script>

而php（process2.php）是：

    $name = ($_GET['name']) ? $_GET['name'] : $_POST['name'];
$phone = ($_GET['phone']) ?$_GET['phone'] : $_POST['phone'];
$email = ($_GET['email']) ?$_GET['email'] : $_POST['email'];
$mailing = ($_GET['newsletter']) ?$_GET['newsletter'] : $_POST['newsletter'];
$comments = ($_GET['comments']) ?$_GET['comments'] : $_POST['comments'];

if($phone) {$phone = '('.substr($phone, 0, 3).') '.substr($phone, 3, 3).'-'.substr($phone, 6, 4);} else {$phone = '(Not Entered)';}

我非常困惑，我不知道该怎么办？

Answer 1

您没有将它们包含在您通过ajax发送的data中。你甚至都没有尝试在你的php中获得service值。

var data =
    'name=' + name.val() +
    '&phone=' + phone.val() +
    '&email=' + email.val() +
    '&comments=' + encodeURIComponent(comments.val()); 
//data only includes name, phone, email, comments

您可能需要尝试jQuery serialize方法而不是上述代码。

var data = $(this).parents('form').serialize();

我对Ajax中的复选框感到困惑

1 个答案: