Using input type=date

Hi - I have a form that captures several elements including a date using the HTML 5 input type=date. I need to pass these captured values to another page to format a response to the user. I am able to retrieve every value except the date using $_POST. Is there something I need to do to convert the raw value to something that can be displayed to the user? Nothing seems to be in the field when it gets to the scondary page.

Thanks for your response.

Rick

Could you post the form’s HTML code and the receiving page’s PHP code?

Here is the form capture code:


<?php
// start PHP session
   session_start();
include('hsg-admin.htm');
include('hsg-header.htm');
?>
<div id="content">
<p>&nbsp;</p>
<form method="post" action="/thankyou-labor.php"  id="laborform">
    
<div id="form-name2">
<fieldset>

<h2>START YOUR FREE HANDYMAN LABOR ESTIMATE NOW!</h2>
<p><span class="white-normal-bold">Labor rates start at $50/hr, get started by answering just a few quick questions!</span></p>
<ul>  
<li> 
 <label for="firstname">First Name:<br /></label>
 <input id="firstname" name="firstname" type="text" title="Enter Your First Name"   required="required"  size="30" maxlength="75" />
</li>
<li><label for="lastname">Last Name:<br /></label>
 <input id="lastname" name="lastname" type="text" title="Enter Your Last Name"   required="required"  size="30" maxlength="75" />
</li>
<li> 
 <label for="zipcode">Zip Code:<br /></label>
 <input id="zipcode" name="zipcode" type="text" title="Enter Your Zip Code" required="required" size="10" maxlength="25" />
</li>
</ul>
</fieldset> 
</div><!-- form-name2 -->
<br />
<div id="form-need2">
<fieldset>

<h2><span class="white-normal-bold">I Need Help With . . .</span></h2>
<ul>  
<li> 
<textarea id="need" name="need" rows="8" cols="40" style="width: 430px" title="I Need Help With . . .">Describe project in as much detail as possible (500 word max)</textarea>
</li>
[B]<li>
 <label for="startdate">Please Enter Start Date:</label>
<input id="startdate" type="date" size="5" maxlength="5" title="Enter Your Requested Start Date" value="<?php echo date("n/j/y"); ?>" />
</li>[/B]
</ul>
</fieldset> 
</div><!-- form-need2 -->
<br />
<div id="form-contact2">
<fieldset>

<h2><span class="white-normal-bold">Final Step</span></h2>
<ul>  
<li> 
 <label for="mail">Email:<br /></label>
 <input id="email" name="email" type="email" title="Enter Your Email Address" required="required" size="35" maxlength="75" /></li>
<li><label for="hphone">Home Phone:<br /></label>
 <input id="hphone" name="hphone" type="text"title="Enter Your Home Phone" required="required" size="20" maxlength="35" />
</li>
<li> 
 <label for="foundus"> <br /></label>
 	<select name="foundus">
	<option value="">Where Did You Find Us</option>
	<option value="local hardware store">local hardware store</option>
	<option value="Google">Google</option>
	<option value="Yahoo">Yahoo</option>
	<option value="Bing">Bing</option>
	<option value="Angieslist">Angies List</option>
	<option value="Realtor">Realtor</option>
	<option value="Referral">Referral</option>
    </select>
</li>
<li>
 <label for="referral"> <br /></label>
 <input id="referral" name="referral" type="text" value="Who Referred You to Us" title="Who Referred You to Us" size="35" maxlength="100" />
</li>
 <label for="security"> <br /></label>
<li id="security"><img src="security-image.php?width=144&amp;height=30;" alt="Security Code" /></li>
<li>
<label for="code">Please Enter The Security Code Above:<br /></label>
<input type="text" name="code" id="code" required="required" title="Enter the Above Security Code" size="5" maxlength="5"  value="" />
</li>
</ul>
<p><span class="white-normal-bold">*Estimates are based on average time to complete projects and cannot be 
Considered a final price due to varying circumstances.</span></p>
<input class="submit" type="submit" name="submit" id="submit" title="This will Send Your Labor request to the Handyman Service Group"  value="Submit" style="height: 40px; width: 100px;" />
<input name="reset" id="Reset" value="Reset" title="This will Clear the Form so that You can Quite or Start Over" type="reset" style="height: 40px; width: 100px;" />
</fieldset> 
		<h3><input type="hidden" name="recipient" value="rick@rgstephens.com" /></h3>
		<h3><input type="hidden" name="subject" value="Request for Handyman Labor Quote" /></h3>
		<p><input type="hidden" name="redirect" value="http://handymanservicegroup.com/thankyou-labor.php"/></p>
		<h3><input type="hidden" name="ipaddr" value="<?php echo $ip=@$REMOTE_ADDR ?>;" /></h3>
</div><!-- form-contact2 -->
</form>
</div><!-- content -->
<?PHP
include('hsg-footer.htm');
?>


Here is the PHP Receiving page:


<?php
// start PHP session
   session_start();
include('hsg-admin.htm');
include('hsg-header.htm');
?>
<div id="content">
<p>&nbsp;</p><p>&nbsp;</p>
<?PHP
      // check for posted form
      if (isset($_POST['submit'])) {
         // see if the code the user typed matched the generated code
         if (strtoupper($_POST['code']) == $_SESSION['code']) {

[B]// this is a stop I have in the code to verify the value	 it is always blank		 
$startdate =  $_POST['startdate'];
echo  "startedate = " . $startdate;
exit();[/B]
		 
			 
		    $body="Name: " . $_POST['firstname'] . " " . $_POST['lastname'] . "\
" . "Zipcode: " . $_POST['zipcode'] . "\
" . "Email: " . $_POST['email'] . "\
" . "Phone: " . $_POST['hphone'] . "\
" . "Need: " . $_POST['need']  . "\
" . "Requested Start Date: " . $_POST['startdate'] . "\
" . "Found Us: " . $_POST['foundus'] . "\
" . "Referred By: " . $_POST['referral'];
            mail($_POST['recipient'], $_POST['subject'], $body) ;
			?>
<h2>Message Received</h2>

<p>In order to provide you with the most accurate estimate  for your project one of our representatives  will be in contact with you by phone or email if any  questions arise. You should expect an emailed quote or  call within 24 hours.</p>

<p>If you happen to miss our call or would like to schedule a handyman immediately we can be reached at the number or email below:</p>
<p>__________________________________________________________________________<br />
Phone: 1-866-870-6526<br />
Email: <a href="mailto:hidden@emailaddress">hidden@emailaddress</a><br />
__________________________________________________________________________<br />
We appreciate the opportunity to discuss your up coming projects with you.</p>

<p>Thank You!<br />
Haley Hougen, President, The handyman group</p>
			<?PHP
         } else {
            ?><h2><?PHP echo 'You have entered the wrong code. Please <a href="home.php">try again</a>.'?></h2><?PHP ;
         }
		 }
?>
<!--=======================================================Put Content Here=============================================================-->
</div><!-- content -->
<!--======================================================End Center Content==============================================================-->
<!--============================================================Footer================================================================-->
<?PHP
include('hsg-footer.htm');
?>
<!--============================================================End Footer===========================================================-->


Thanks

Unless I’m missing something, this line:

<input id="startdate" type="date" size="5" maxlength="5" title="Enter Your Requested Start Date" value="<?php echo date("n/j/y"); ?>" />

is missing name="startdate"

The startdate field will only be submitted, as with all form fields, when you give it a name attribute.

Yep - I’m just blind I guess. Thanks. That was the problem of course.

Thanks - Sometime you just can’t see the forest for the trees. That of course was the issue. Thanks for the response.

Hi,

I have IE10 and it doesn’t shows the calendar when using type=“date” thing.

Thanks.

According to caniuse, it’s not supported in IE10:

This is where addons such as Modernizr can become very useful, in providing support for such modern features that web browsers such as Internet Explorer are missing.

Good point, although I can’t tell from their “developer dialect” whether Modernizr actually enables this or not.

The job of Modernizr is to determine whether the browser supports certain features, not to “enable” such missing features when the web browser doesn’t have that native functionality.
Others though have built on top of the information that Modernizr provides, such as HTML5Forms which provides the functionality to web browsers that don’t natively support them.

You can see a demo of the date field (native first, and otherwise falling back to a custom date picker) in action at http://www.useragentman.com/tests/html5Forms/tests/html5Forms/dateTime.html

Thanks Paul. Interesting links.

Hi,

So you mean to say that I use Modernizr to get all the features of HTML5Forms even if they are not supported by the browser ? Or it just tells me whether a feature is support or not ?

Thanks.

I mean that Modernizr determines whether the browser supports certain features, and that others such as HTML5Forms use that detected info provide the web browser with the missing functionality.