html - Javascript credit card expiration validation -
i new html , javascript thank in advance help. trying add validation form. having trouble speificlaly credit card expiration date validation. expecting if date previous todays date should trigger alert of "your card expired. please select valid expiration date." let submit expired date.
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>assignment 8</title> <meta http-equiv="content-language" content="en-us"/> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <style type="text/css"> table, th, td { border: 1px solid black; border-collapse: collapse; } </style> <script type="text/javascript"> function validate() { if( document.billing.cardnumber.value == "" || isnan( document.billing.cardnumber.value ) || document.billing.cardnumber.value.length != 9 ){ alert( "please provide card number in format #########." ); document.billing.cardnumber.focus() ; return false; } if( document.billing.cardtype.value == "none" ) { alert( "please select credit card type" ); document.billing.cardtype.focus() ; return false; } return( true ); var today, someday; var expirationmonth=document.getelementbyname("expirationmonth"); var expirationyear=document.getelementbyname("expirationyear"); today = new date(); someday = new date(); someday.setfullyear(expirationyear, expirationmonth, 1); if (someday < today) { alert("your card expired. please select valid expiration date"); return false; } } </script> </head> <body> <form action="/~ka14804/assignment4/assignment4.php" name="billing" onsubmit="return(validate());" method="post" > <fieldset> <legend>billing:</legend> <input type="radio" name="billtype" value="credit card" checked="checked"/>credit card <input type="radio" name="billtype" value="bill customer"/>bill customer </fieldset> <br></br> <label>credit card type:</label> <select name="cardtype"> <option value="none" selected>[choose yours]</option> <option value="visa">visa</option> <option value="mastercard">mastercard</option> <option value="american express">american express</option> </select> <br></br> card number: <input type="text" name="cardnumber"/> <br></br> <label>expiration date:</label> <select name="expirationmonth"> <option value="january">january</option> <option value="february">february</option> <option value="march">march</option> <option value="april">april</option> <option value="may">may</option> <option value="june">june</option> <option value="july">july</option> <option value="august" selected="selected">august</option> <option value="september">september</option> <option value="october">october</option> <option value="november">november</option> <option value="december">december</option> </select> <select name="expirationyear"> <option value="2015" selected="selected">2015</option> <option value="2016">2016</option> <option value="2017">2017</option> <option value="2018">2018</option> <option value="2019">2019</option> <option value="2020">2020</option> <option value="2021">2021</option> <option value="2022">2022</option> <option value="2023">2023</option> <option value="2024">2024</option> </select> <br></br> <input type="checkbox" name="billingdefault" value="set default billing method" checked="checked"/>set default billing method <br></br> <input type="submit" value="submit"/> <input type="reset" value="reset"/> </form> <p> <a href="http://validator.w3.org/check?uri=referer"> <img src="http://www.w3.org/icons/valid-xhtml10" alt="valid xhtml 1.0 transitional" height="31" width="88" /> </a> </p> </body>
you have value of element, can't pass in element directly:
var expirationmonth=document.getelementbyname("expirationmonth"); var expirationyear=document.getelementbyname("expirationyear"); today = new date(); someday = new date(); someday.setfullyear(expirationyear.value, expirationmonth.value, 1);
also, code never getting called anyway, since right above it:
if( document.billing.cardtype.value == "none" ) { //other stuff return false; } return( true );
that part return, meaning under never happen
Comments
Post a Comment