Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
?
Solved

Auto Populate Date Field

Posted on 2011-03-01
8
Medium Priority
?
678 Views
Last Modified: 2012-06-27
I attached the code in question. If you pull it up in a browser you will see the last two fields named order date & assign date.  My question is, if someone enters a date of 2/7/2011 in the order date box then hits the tab key to go to the next field, a date of 2/14/2011 will automatically get populated into the assign date field.

Basically, anything that is entered into the date field, then in the assign date box, a date 7 days in the future will appear. Is this possible?
<html>

<head>
<title> Update Database </title>
</head>

<body>
<form method="post" action="add.php">

<b>First Name:</b> <br />

<input type="text" name="customer_fname" size="35" /><br />

<b>Last Name:</b> <br />

<input type="text" name="customer_lname" size="35" /><br />

<b>Location:</b> <br />

<input type="text" name="location" size="35" /><br />

<b>Order Date:</b> <br />

<input type="text" name="order_date" size="35" /><br />

<b>Assign Date:</b> <br />

<input type="text" name="assgn_date" size="35" /><br />

<input type="submit" value="Submit" />

</form>
</body>
</html>

Open in new window

0
Comment
Question by:wantabe2
  • 3
  • 2
  • 2
  • +1
8 Comments
 
LVL 18

Expert Comment

by:ChetOS82
ID: 35008594
Put an onchange event on the order_date, and give assign_date an id.  Then use the script below (this is off the top of my head, some debugging will be required):

<input type="text" name="order_date" size="35" onchange="populateAssignedDate(this);" />
<input type="text" name="assgn_date" id="assign_date" size="35" />

<script type="text/javascript">
function populateAssignedDate(order_date_input) {
  // Convert this date to a Date object.
  var splitOn = '';
  if (order_date_input.indexOf("/") != -1) {
     splitOn = '/';
  } else if (order_date_input.indexOf("-")) {
    splitOn = '-';
  }

  if (splitOn === '') {
    alert("Error: invalid date delimiter.  Valid delimiters are forward slash and dash.");
    return;
  }

  // Assume date format: MM/DD/YYYY
  var dateParts = order_date_input.value.split(splitOn);
  var newDate = new Date((dateParts[0] - 1), dateParts[1], dateParts[2]);
  newDate.setDate(newDate.getDate() + 7);

   // Get the assign_date text box.
  var assigned_date = document.getElementById('assign_date');
  assign_date.value = (newDate.getMonth() + 1) + splitOn + newDate.getDate() + splitOn + newDate.getFullYear();
}
</script>

Open in new window

0
 
LVL 19

Accepted Solution

by:
daveamour earned 2000 total points
ID: 35008647
Yes this is possible - I would do this with Javascript.

The attached code is far from perfect but it points you in the right direction.
<html>

<head>
<title> Update Database </title>

<script language="javascript" type="text/javascript">
    function LoadAssignDate()
    {
        var orderDate = document.getElementById("order_date").value;
        
        var dateComponents = orderDate.split('/');
        
        var assignDate = new Date(dateComponents[2], dateComponents[1]-1, parseInt(dateComponents[0]) + 7, 0, 0, 0, 0);
        
        document.getElementById("assgn_date").value = assignDate;
    }
</script>

</head>

<body>
<form method="post" action="add.php">

<b>First Name:</b> <br />

<input type="text" name="customer_fname" size="35" /><br />

<b>Last Name:</b> <br />

<input type="text" name="customer_lname" size="35" /><br />

<b>Location:</b> <br />

<input type="text" name="location" size="35" /><br />

<b>Order Date:</b> <br />

<input type="text" id="order_date" name="order_date" size="35" onblur="LoadAssignDate();" /><br />

<b>Assign Date:</b> <br />

<input type="text" id="assgn_date" name="assgn_date" size="35" /><br />

<input type="submit" value="Submit" />

</form>
</body>
</html>

Open in new window

0
 
LVL 111

Expert Comment

by:Ray Paseur
ID: 35011595
What is the user-experience that you want to achieve?  Is the user to be allowed to change the assign date?  If so you might not bother filling in the field - just tell them that unless they change it, the assign date will be seven days after the order date.  If the user is not allowed to change it, why put it on the screen at all?

You will still have to validate all of this in the server side script.  In there you will use strtotime() to turn the order date into a UNIX timestamp.  It's fairly easy to add seven days to a UNIX timestamp, something like this:

$week_later = $now_timestamp + 60*60*24*7;

Some more information on handling DATETIME information is available here:
http://www.experts-exchange.com/Web_Development/Web_Languages-Standards/PHP/A_201-Handling-date-and-time-in-PHP-and-MySQL.html
0
Restore individual SQL databases with ease

Veeam Explorer for Microsoft SQL Server delivers an easy-to-use, wizard-driven interface for restoring your databases from a backup. No expert SQL background required. Web interface provides a complete view of all available SQL databases to simplify the recovery of lost database

 
LVL 15

Author Comment

by:wantabe2
ID: 35011766
This code is going to part of a work flow system I'm trying to set up. At this time, the data is going to get written to a mysql database. The attached code is what I have so far. I have several other date fields I will type in later but I just put in two dates to help keep the confusion down.

Basically, all dates will be based off of the order date. Once the order date is typed in my the user & they hit the tab key, I'd like the other dates to be automatically typed in in the format year-month-day. I'm very new to PHP & HTML so please excuse my ignorance. If I could get the code to make the "due date" field auto populate I think I can figure out the rest of it. In the code below. If a user types in 2011-2-7 in the "order date" field then tabs to the next field, I'd like the date 2011-2-14 to be automatically typed in the "due date" field.  I've attached the code again so hopfully this will help someone figure it out.
<html>

<head>
<title> Update Database </title>
</head>

<body>
<form method="post" action="add.php">

<b>First Name:</b> <br />

<input type="text" name="customer_fname" size="35" /><br />

<b>Last Name:</b> <br />

<input type="text" name="customer_lname" size="35" /><br />

<b>Location:</b> <br />

<input type="text" name="location" size="35" /><br />

<b>Order Date:</b> <br />

<input type="text" name="order_date" size="35" /><br />

<b>Due Date:</b> <br />

<input type="text" name="due_date" size="35" /><br />

<input type="submit" value="Submit" />

</form>
</body>
</html>

Open in new window

0
 
LVL 111

Expert Comment

by:Ray Paseur
ID: 35012017
You might find this book helpful.  It has great examples and is very readable.  
http://www.sitepoint.com/books/phpmysql4/
0
 
LVL 15

Author Comment

by:wantabe2
ID: 35016890
daveamour,
The code you provided come closest to working for me than anything. Instead of getting a date in the assign date field I get the text NaN. I've attached a screenshot below. Thanks again for your help.
nan.JPG
0
 
LVL 19

Expert Comment

by:daveamour
ID: 35020822
Thats becasue the date you have entered is year first and I was assuming year last so just swap the code around.  Validating dates entered as free text can be very difficult because of these differences so maybe its best top use a calendar control?
0
 
LVL 19

Expert Comment

by:daveamour
ID: 35020828
ps - NaN = Not a number
0

Featured Post

Get your Conversational Ransomware Defense e‑book

This e-book gives you an insight into the ransomware threat and reviews the fundamentals of top-notch ransomware preparedness and recovery. To help you protect yourself and your organization. The initial infection may be inevitable, so the best protection is to be fully prepared.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When crafting your “Why Us” page, there are a plethora of pitfalls to avoid. Follow these five tips, and you’ll be well on your way to creating an effective page.
Many old projects have bad code, but the budget doesn't exist to rewrite the codebase. You can update this code to be safer by introducing contemporary input validation, sanitation, and safer database queries.
In this tutorial viewers will learn how to embed Flash content in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <object> tag to embed Flash content.: To specify that the object is Flash content, d…
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.
Suggested Courses

580 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question