我疯狂地试图找出为什么没有通过电子邮件发送datepicker变量以及我的表单提交的其余部分?
这是html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<link rel="shortcut icon" href="assets/ico/favicon.png">
<title>Jumbotron Template for Bootstrap</title>
<!-- Bootstrap core CSS -->
<link href="css/bootstrap.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="css/andy.css" rel="stylesheet" type="text/css">
<link href="css/form.css" rel="stylesheet" type="text/css">
<link href="css/mq.css" rel="stylesheet" type="text/css">
<link href="css/default.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="css/jquery.fancybox.css" type="text/css" media="screen" />
<!-- Google Web Fonts -->
<link href='http://fonts.googleapis.com/css?family=Maiden+Orange' rel='stylesheet' type='text/css'>
<style>
.cap-overlay .button { margin-top:10px}
.cap-overlay{width: 100%; color:#fff; background: rgba(0, 0, 0, 0.43);left:0;padding:12px; line-height: 1.4em;font-size:14px}
.cap-overlay h5 {color:#fff;}
a[data-toggle="drop-panel"] {display: block;}
</style>
<script>
$(window).load(function(){
$('.hcaption').hcaptions();
});
</script>
<script>
$(document).ready(function() {
$(".overlay").fancybox({
helpers : {
overlay : {
opacity: 0.8,
css : {
'background-color' : '#000'
}
}
},
maxWidth : 900,
maxHeight : 380,
fitToView : false,
width : 650,
height : 400,
autoSize : false,
closeClick : false,
openEffect : 'none',
closeEffect : 'none',
helpers : {
overlay : {closeClick: false} // prevents closing when clicking OUTSIDE fancybox
}
});
</script>
<script>
var hdate = $('input#hdate').datepicker('getDate');
</script>
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="../../assets/js/html5shiv.js"></script>
<script src="../../assets/js/respond.min.js"></script>
<![endif]-->
</head>
<body>
<form method="post" action="sendmail.php">
<label class='form_error_title'>Please check the required fields</label>
</div>
<ol class='phpfmg_form' >
<li class='field_block' id='field_0_div'><div class='col_label'>
<label class='form_field'>Date of Hunt</label> <label class='form_required' >*</label> </div>
<div class='col_field'>
<input type="text" name="hdate" id="hdate" class="datepicker input-large">
<div id='field_0_tip' class='instruction'></div>
</div>
</li>
<br>
<li class='field_block' id='field_1_div'><div class='col_label'>
<label class='form_field'>Name</label> <label class='form_required' >*</label> </div>
<div class='col_field'>
<input type="text" name="name" id="name" value="" class='text_box input-large'>
<div id='field_1_tip' class='instruction'></div>
</div>
</li>
<br>
<li class='field_block' id='field_2_div'><div class='col_label'>
<label class='form_field'>E-Mail Address</label> <label class='form_required' >*</label> </div>
<div class='col_field'>
<input type="text" name="email" id="email" value="" class='text_box input-large'>
<div id='field_2_tip' class='instruction'></div>
</div>
</li>
<br>
<li class='field_block' id='field_3_div'><div class='col_label'>
<label class='form_field'>Phone Number</label> <label class='form_required' >*</label> </div>
<div class='col_field'>
<input type="text" name="phone" id="phone" value="" class='text_box input-large'>
<div id='field_3_tip' class='instruction'></div>
</div>
</li>
<br>
<li class='field_block' id='field_4_div'><div class='col_label'>
<label class='form_field'>Select the hunt you're interested in:</label> <label class='form_required' >*</label> </div>
<div class='col_field'>
<input type='checkbox' name='hunt_type' id='gator' value="Gator" class='form_checkbox' ><label class='form_choice_text' for='field_4_0'>Gator</label><br>
<input type='checkbox' name='hunt_type' id='hog' value="Hog" class='form_checkbox' ><label class='form_choice_text' for='field_4_1'>Hog</label><br>
<input type='checkbox' name='hunt_type' id='dove' value="Dove" class='form_checkbox' ><label class='form_choice_text' for='field_4_2'>Dove</label><br>
</div>
</li>
<br>
<li class='field_block' id='field_5_div'><div class='col_label'>
<label class='form_field'>Total # of Guests</label> <label class='form_required' >*</label> </div>
<div class='col_field'>
<select name='guests' id='total-guests' class='text_select' >
<option value="1" >1</option>
<option value="2" >2</option>
<option value="3" >3</option>
<option value="4" >4</option>
<option value="5" >5</option>
<option value="6" >6</option>
</select>
<div id='field_5_tip' class='instruction'></div>
</div>
</li>
<br>
<li class='field_block' id='field_6_div'><div class='col_label'>
<label class='form_field'>Additional Information?</label> <label class='form_required' > </label> </div>
<div class='col_field'>
<textarea name="info" id="info" rows=4 cols=25 class='text_area input-large'></textarea>
<div id='field_6_tip' class='instruction'></div>
</div>
</li>
<!-- Add Captcha Here -->
<li>
<div class='col_label'> </div>
<div class='form_submit_block col_field'>
<input type="submit" value="Submit" class='form_button'>
<span id='phpfmg_processing' style='display:none;'>
<img id='phpfmg_processing_gif' src='admin.php?mod=image&func=processing' border=0 alt='Processing...'> <label id='phpfmg_processing_dots'></label>
</span>
</div>
</li>
</ol>
</form>
</div>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="dist/js/bootstrap.min.js"></script>
<script src="js/jquery.js"></script>
<script src="js/dropdown.js"></script>
<script src="js/collapse.js"></script>
<script type="text/javascript" src="js/jquery.fancybox.js"></script>
<script type="text/javascript" src="js/tab.js"></script>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jQuery/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="js/zebra_datepicker.js"></script>
<script>
$(document).ready(function() {
// assuming the controls you want to attach the plugin to
// have the "datepicker" class set
$('input.datepicker').Zebra_DatePicker();
});
</script>
</body>
</html>
这是我的php:
<?php
$hdate = $_POST['hdate'];
$name = $_POST['name'];
$email = $_POST['email'];
$phone = $_POST['phone'];
$hunt_type = $_POST['hunt_type'];
$guests = $_POST['guests'];
$info = $_POST['info'];
$to = "andyw504@gmail.com";
$subject = "Some subject";
$body = "You have a new reservation!<br><br>
Date of Hunt: $hdate<br>
Name: $name<br>
E-mail: $email<br>
Phone Number: $phone<br>
Type of Hunt: $hunt_type<br>
Number of Guests: $guests<br>
Comments: $info<br>";
$headers = "From: $email" . "\r\n" .
"Reply-To: $to" . "\r\n" .
"X-Mailer: PHP/" . phpversion();
$headers .= 'MIME-Version: 1.0' . "\n";
$headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";
mail($to,$subject,$body,$headers);
echo "Email sent.";
exit;
?>
他们要我添加更多细节。弹出日期选择器并将日期放在文本区域中。当我通过电子邮件调用该变量时,它是空白的。除日期外,每个其他字段都会在电子邮件中记录和发送,日期是表单中最重要的部分之一。
答案 0 :(得分:0)
首先下载Pickadate.js并查看index.htm
文件。
您会看到此<input id="input_01" class="datepicker" type="text">
只是将其更改为<input id="input_01" class="datepicker" type="text" name="hdate">
,您就可以开展业务了。
另外还有一些主题可供选择。
[]
中为所有三个复选框添加了name='hunt_type[]'
。这很重要,因为如果有人选择了2个或更多,那么只有一个会出现在表单中。还在PHP处理程序中添加了这个,它将处理“搜索类型”的数组:
foreach($_POST['hunt_type'] as $value) {
$hunt_type.= $value . "\n";
}
<form method="post" action="handler.php">
Hunt date:
<input type="text" name="hdate">
<br>
Hunt type:
<li class='field_block' id='field_4_div'><div class='col_label'>
<label class='form_field'>Select the hunt you're interested in:</label> <label class='form_required' >*</label> </div>
<div class='col_field'>
<input type='checkbox' name='hunt_type[]' id='gator' value="Gator" class='form_checkbox' ><label class='form_choice_text' for='field_4_0'>Gator</label><br>
<input type='checkbox' name='hunt_type[]' id='hog' value="Hog" class='form_checkbox' ><label class='form_choice_text' for='field_4_1'>Hog</label><br>
<input type='checkbox' name='hunt_type[]' id='dove' value="Dove" class='form_checkbox' ><label class='form_choice_text' for='field_4_2'>Dove</label><br>
</div>
</li>
<br>
Name:
<input type="text" name="name">
<br>
Email:
<input type="text" name="email">
<br>
Tel:
<input type="text" name="phone">
<br>
Guests:
<input type="text" name="guests">
<br>
Comments:<br>
<textarea rows="6" name="info" cols="38"></textarea>
<br>
<input type="submit" name="submit" value="Submit">
</form>
<?php
$hdate = $_POST['hdate'];
$name = $_POST['name'];
$email = $_POST['email'];
$phone = $_POST['phone'];
//$hunt_type = $_POST['hunt_type'];
$guests = $_POST['guests'];
$info = $_POST['info'];
$to = "email@example.com";
$subject = "Some subject" . "\r\n";
foreach($_POST['hunt_type'] as $value) {
$hunt_type.= $value . "\n";
}
$body = "You have a new reservation!<br><br>
Date of Hunt: $hdate<br>
Name: $name<br>
E-mail: $email<br>
Phone Number: $phone<br>
Type of Hunt: $hunt_type<br>
Number of Guests: $guests<br>
Comments: $info<br>";
$headers = "From: $email" . "\r\n" .
"Reply-To: $to" . "\r\n" .
"X-Mailer: PHP/" . phpversion();
$headers .= 'MIME-Version: 1.0' . "\n";
$headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";
mail($to,$subject,$body,$headers);
echo "Email sent.";
exit;
?>