Need Help with Javascript to validate Month/month year for credit card

I'm a newbie when it comes to Javascript and this what I have figured out so far. The thing I need to do is create a script that will prompt the user that they are using an credit card with an expired date, based on the current month and year. Can someone help?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>

<title></title>

<script type="text/javascript">
var monthtext=['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sept','Oct','Nov','Dec'];
function populatedropdown(monthfield, yearfield){
var today=new Date()
var monthfield=document.getElementById(monthfield)
var yearfield=document.getElementById(yearfield)
for (var m=0; m<12; m++)
monthfield.options[m]=new Option(monthtext[m], monthtext[m])
var thisyear=today.getFullYear()
for (var y=0; y<20; y++){
yearfield.options[y]=new Option(thisyear, thisyear)
thisyear+=1
}
yearfield.options[0]=new Option(today.getFullYear(), today.getFullYear(), true, true)
}
</script>

<h1></h1>
<hr>
<table>
<form method="post" action="showform.php">
<fieldset id="personal">
Name:<input type="text" name="name" size="30" /> <br />

Address:<input type="text" name="address" size="30" /> <br />
Town/City:<input type="text" name="city" size="30" /> <br />
State:<select name="state" size="1">
<option>Alabama</option>
<option>Alaska</option>
<option>Alabama</option>
<option>Arizona</option>
<option>California </option>
<option>Colorado</option>
<option>Connecticut</option>
<option>Delaware</option>
<option>District of Colombia</option>
<option>Florida</option>
<option>Georgia</option>
<option>Hawaii</option>
<option>Idaho</option>
<option>Illinois</option>
<option>Indiana</option>
<option>Iowa</option>
<option>Kansas</option>
<option>Kentucky </option>
<option>Louisiana</option>
<option>Maine</option>
<option>Maryland</option>
<option>Massachusetts</option>
<option>Michigan</option>
<option>Minnesota</option>
<option>Mississippi</option>
<option>Missouri</option>
<option>Montana</option>
<option>Nebraska</option>
<option>Nevada</option>
<option>New Hampshire</option>
<option>New Jersey</option>
<option>New Mexico</option>
<option>New York</option>
<option>North Carolina</option>
<option>North Dakota</option>
<option>Ohio</option>
<option>Oklahoma</option>
<option>Oregon</option>
<option>Pennsylvania</option>
<option>Rhode Island</option>
<option>South Carolina</option>
<option>South Dakota</option>
<option>Tennessee</option>
<option>Texas</option>
<option>Utah</option>
<option>Vermont</option>
<option>Virginia</option>
<option>Washington </option>
<option>West Virginia</option>
<option>Wisconsin</option>
<option>Wyoming</option>
</select><br />
Zip code:<input type="text" name="zip" size="5" maxlength="5" /> <br />
Telephone:<input type="text" name="Telephone" size="12" maxlength="12" /> <br />
Date of Birth:<input type="text" name "Date of Birth" size="10" maxlegth="10" /> <br />
</table>
<hr>
<table>
<p id="Credit Card type"><label>Credit Card type:</label>

<input type="radio" name="size" value="MasterCard" />MasterCard
<input type="radio" name="size" value="Visa" />Visa
<input type="radio" name="size" value="American Express" />American Express
<input type="radio" name="size" value="Discover" />Discover <br />


<center><form name=f1><table border=0><tr>
Credit Card Expiration <br />
</select>
<select id="monthdropdown">
</select>
<select id="yeardropdown">
</select>
</form>

<script type="text/javascript">
window.onload=function(){
populatedropdown("monthdropdown", "yeardropdown")
}
</script>

</table>
GT98Asked:
Who is Participating?
 
ZvonkoConnect With a Mentor Systems architectCommented:
Here an example:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>

<title></title>

<script type="text/javascript">
var monthtext=['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sept','Oct','Nov','Dec'];
function populatedropdown(monthfield, yearfield){
  var today=new Date()
  var monthfield=document.getElementById(monthfield)
  var yearfield=document.getElementById(yearfield)
  for (var m=0; m<12; m++)
    monthfield.options[m]=new Option(monthtext[m], monthtext[m])
  var thisyear=today.getFullYear()
  for (var y=0; y<20; y++){
    yearfield.options[y]=new Option(thisyear, thisyear)
    thisyear+=1
  }
  yearfield.options[0]=new Option(today.getFullYear(), today.getFullYear(), true, true)
}
function checkForm(theForm){
  var actDate = new Date();
  if(theForm.yeardropdown.value==actDate.getFullYear()){
    if(theForm.monthdropdown.selectedIndex<actDate.getMonth()){
      alert("Your CreditCard seams to be expired.");
      theForm.monthdropdown.focus();
      return false;
    }
  }
  return true;
}
</script>

<h1></h1>
<hr>
<table>
<form method="post" action="showform.php" onSubmit="return checkForm(this)">
<fieldset id="personal">
Name:<input type="text" name="name" size="30" /> <br />

Address:<input type="text" name="address" size="30" /> <br />
Town/City:<input type="text" name="city" size="30" /> <br />
State:<select name="state" size="1">
<option>Alabama</option>
<option>Alaska</option>
<option>Alabama</option>
<option>Arizona</option>
<option>California </option>
<option>Colorado</option>
<option>Connecticut</option>
<option>Delaware</option>
<option>District of Colombia</option>
<option>Florida</option>
<option>Georgia</option>
<option>Hawaii</option>
<option>Idaho</option>
<option>Illinois</option>
<option>Indiana</option>
<option>Iowa</option>
<option>Kansas</option>
<option>Kentucky </option>
<option>Louisiana</option>
<option>Maine</option>
<option>Maryland</option>
<option>Massachusetts</option>
<option>Michigan</option>
<option>Minnesota</option>
<option>Mississippi</option>
<option>Missouri</option>
<option>Montana</option>
<option>Nebraska</option>
<option>Nevada</option>
<option>New Hampshire</option>
<option>New Jersey</option>
<option>New Mexico</option>
<option>New York</option>
<option>North Carolina</option>
<option>North Dakota</option>
<option>Ohio</option>
<option>Oklahoma</option>
<option>Oregon</option>
<option>Pennsylvania</option>
<option>Rhode Island</option>
<option>South Carolina</option>
<option>South Dakota</option>
<option>Tennessee</option>
<option>Texas</option>
<option>Utah</option>
<option>Vermont</option>
<option>Virginia</option>
<option>Washington </option>
<option>West Virginia</option>
<option>Wisconsin</option>
<option>Wyoming</option>
</select><br />
Zip code:<input type="text" name="zip" size="5" maxlength="5" /> <br />
Telephone:<input type="text" name="Telephone" size="12" maxlength="12" /> <br />
Date of Birth:<input type="text" name "Date of Birth" size="10" maxlegth="10" /> <br />
</table>
<hr>
<table>
<p id="Credit Card type"><label>Credit Card type:</label>

<input type="radio" name="size" value="MasterCard" />MasterCard
<input type="radio" name="size" value="Visa" />Visa
<input type="radio" name="size" value="American Express" />American Express
<input type="radio" name="size" value="Discover" />Discover <br />


<center><form name=f1><table border=0><tr>
Credit Card Expiration <br />
</select>
<select id="monthdropdown">
</select>
<select id="yeardropdown">
</select>
<input type=submit
</form>

<script type="text/javascript">
window.onload=function(){
populatedropdown("monthdropdown", "yeardropdown")
}
</script>

</table>


0
 
GT98Author Commented:
Thanks!
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.