::: Form Validation - Dropdownbox :::

jduk · #1 03-12-2004, 06:10 AM

Hi friends,

Here is a JavaScript validation problem. If user selects the option 'solo' or 'switch' card from drop down and if he do not enter his 'issue number', an alert should say a message, "Please enter your Issue Number".

I have some problem in the code, can some body help me in this regard please.

--------------------------------------

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>::: try - issue number :::</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript">
function check() {
var accepted=null;

if (form.name_on_card.value.length == 0) {
alert("Please enter the name on card.");
form.name_on_card.focus();
return false;
}
if (form.card_number.value.length == 0) {
alert("Please enter a card number.");
form.card_number.focus();
return false;
}
if ((form.card_type.options[form.card_type.selectedIndex].value == solo) && (form.issue_number.value.length == 0)) {
alert("You have selected Solo card, please enter Issue Number" );
form.issue_number.focus();
return false;
}
if (form.cvv2.value.length == 0) {
alert("Please enter a CVV2 number.");
form.cvv2.focus();
return false;
}
}
//-->
</script>
</head>
<body>
<form name="form" method="post" action="xyz.html">
<table border="0" cellpadding="1" cellspacing="0">
<tr>
<td align="right" valign="top">Name on card</td>
<td valign="top"><input name="name_on_card" type="text" size="35" maxlength="35">
</td>
</tr>
<tr>
<td align="right" valign="top">Card number:</td>
<td valign="top"><input name="card_number" type="text" size="18" maxlength="22">
</td>
</tr>
<tr>
<td align="right" valign="top">Card type</td>
<td valign="top"><select name="card_type">
<option value="--" selected>Select a credit card</option>
<option value="visa">Visa</option>
<option value="master">Master</option>
<option value="amex">American Express</option>
<option value="switch">Switch</option>
<option value="solo">Solo</option>
</select>
</td>
</tr>
<tr>
<td align="right" valign="top">Issue Number</td>
<td valign="top"><input name="issue_number" type="text" size="5" maxlength="2">
</td>
</tr>
<tr>
<td align="right" valign="top">Security code</td>
<td valign="top"><input name="security_code" type="text" id="security_code" size="5" maxlength="5">
</td>
</tr>
</table>
<p align="left">
<input name="submit" type="submit" id="submit" onClick="return check()" value="Submit">
<input name="reset" type="reset" value="Reset">
</form>
</body>
</html>

--------------------------------------
Thanks for your time on my query..

jaegernaut · #2 03-12-2004, 07:50 AM

Here are the changes:

1. Add quotes around the text solo in this line:
if ((form.card_type.options[form.card_type.selectedIndex].value == solo) && (form.issue_number.value.length == 0)) {

2. Comment out this code, you don't have a CVV2 field anywhere, so this can be removed or the names need to be changed to coincide.
if (form.cvv2.value.length == 0) {
alert("Please enter a CVV2 number.");
form.cvv2.focus();
return false;
}

3. Add this code in place of No. 2 above, this will catch the Switch card/Issue Number requirement.
if ((form.card_type.options[form.card_type.selectedIndex].value == "switch") && (form.issue_number.value.length == 0)) {
alert("You have selected Switch card, please enter Issue Number" );
form.issue_number.focus();
return false;
}

Just an observation:
This form can be submitted without selecting a card type. If you want to make sure they choose something there you can add this code as well:
if ((form.card_type.options[form.card_type.selectedIndex].value == "--")) {
alert("Please select a card type." );
form.card_type.focus();
return false;
}

jduk · #3 03-12-2004, 11:04 AM

Hi jaegernaut,

Great, it worked.. Thanks a bunch.

jaegernaut · #4 03-12-2004, 11:43 AM

Glad to help. Feel free to post here again for that other issue you messaged me about. Sounds like it is basically the same issue with a different set of code, so it will go along with this post.

jduk · #5 03-12-2004, 11:47 AM

Thanks for the quick reply.

Those I have sent as the personal message are my client's URLs. They do not want to post it on publice forums and will be available to all. So I have sent as PM to You.

Thanks,

Jag

jduk · #6 03-17-2004, 10:21 AM

Hi there,

I have tried it with the html page... its working great...
When I tried in php page...
the vadidation is being ignored only for the following code.
-------------------------
if ((form.card_type.options[form.card_type.selectedIndex].value == "switch") && (form.issue_number.value.length == 0)) {
alert("You have selected Switch card, please enter Issue Number" );
form.issue_number.focus();
return false;
}
-------------------------

rest everything is working fine...
This is the code...
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
<script language="JavaScript">

function isCCdateExpired(month, year) {
var expires=new Date(year, month, 1);
today=new Date();
var one_day=1000*60*60*24;
if (Math.ceil((today.getTime()-expires.getTime())/(one_day)) >= 1) {
return true;
} else {
return false;
}
}

function checkCCNumber(form, passed) {
var card_types=new Array();
card_types["VisaCard"]="Visa";
card_types["MasterCard"]="MasterCard";
card_types["AmExCard"]="American Express";
card_types["DiscoverCard"]="Discover/Novus";
card_types["Diners"]="Diners Club";
card_types["JCB"]="JCB";
card_types["Carte"]="Carte Blanche";
card_types["BankCard"]="Australian BankCard";
card_types["Switch"]="Switch";
card_types["Solo"]="Solo";
card_types["Other"]="Other";
var cc=form.card_number.value;
var accepted=null;

if (form.name_on_card.value.length == 0) {
alert("Please enter the name on card.");
form.name_on_card.focus();
return false;
}
if (form.card_number.value.length == 0) {
alert("Please enter a card number.");
form.card_number.focus();
return false;
}
if (form.exp_month.value.length == 0) {
alert("Please enter the expiration month.");
form.exp_month.focus();
return false;
}
if (form.exp_year.value.length == 0) {
alert("Please enter the expiration year.");
form.exp_year.focus();
return false;
}
if (isCCdateExpired((form.exp_month.options[form.exp_month.selectedIndex].value),(form.exp_year.options[form.exp_year.selectedIndex].value))) {
alert("This credit card has expired!" );
form.exp_month.focus();
return false;
}

if ((form.card_type.options[form.card_type.selectedIndex].value == "switch") && (form.issue_number.value.length == 0)) {
alert("You have selected Switch card, please enter Issue Number" );
form.issue_number.focus();
return false;
}
if (form.card_type.options[form.card_type.selectedIndex].value == "solo" && form.issue_number.value.length == 0) {
alert("You have selected Solo card, please enter Issue Number" );
form.issue_number.focus();
return false;
}

if (form.cvv2.value.length == 0 && passed == 0) {
alert("Please enter a CVV2 number.");
form.cvv2.focus();
return false;
}
// accepted=new Array(card_types[form.card_type.options[form.card_type.selectedIndex].value]);
// if (isCreditCard(cc,accepted)) {
// return true;
// } else {
// alert("Credit Card number is invalid! Please correct this");
// form.card_number.focus();
// return false;
// }
}
//-->
</script>
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

jaegernaut · #7 03-17-2004, 10:50 AM

I don't know anything about PHP, so I'm just guessing now.

If that is the only piece of validation that is not occuring on the php page, then I would look at changing it to look like the if statement for "solo". They work exactly the same, so if it is taking the "solo" statement it should take the "switch" statement as well.

Change this:

PHP Code:


			
if ((form.card_type.options[form.card_type.selectedIndex].value == "switch") && (form.issue_number.value.length == 0)) { 

alert("You have selected Switch card, please enter Issue Number" ); 

form.issue_number.focus(); 

return false; 

}

To this:

PHP Code:


			
if (form.card_type.options[form.card_type.selectedIndex].value == "switch" && form.issue_number.value.length == 0) { 

alert("You have selected Switch card, please enter Issue Number" ); 

form.issue_number.focus(); 

return false; 

}

Outside of that, you might check in the PHP forum and see if they can help further.

jduk · #8 03-17-2004, 11:40 AM

Hi Thanks for quick reply,

I tried it but did not work... it is skipping only this chunk of code... now, I have an idea about that.
I think we need to write a function for this, like "isCCdateExpired();"

-------------
function isIssueNumber(cardtype, value) {

if (cardtype == "switch" && value ==0) {
return true;
elseif (cardtype == "solo" && value ==0) {
return true;
} else {
return false;
}
}
------------------------
and.....

~~~~~~~~~~~~~~~~~~~~~~~
if (isIssueNumber((form.card_type.options[form.card_type.selectedIndex].value),(form.issue_number.value.length))) {
alert("Please enter Issue Number" );
form.issue_number.focus();
return false;
}
~~~~~~~~~~~~~~~~~~~~~~~~~~

can you please correct the above function isIssueNumber();
coz, i do not have good knowledge of coding.

Thanks,

jaegernaut · #9 03-17-2004, 11:50 AM

That was pretty close. I've made a couple of minor changes:

PHP Code:


			
function isIssueNumber(cardtype, value) { 

if (cardtype == "switch" && value == 0) { 

return true; 

} else if (cardtype == "solo" && value == 0) { 

return true; 

} else { 

return false; 

} 

} 



~~~~~~~~~~~~~~~~~~~~~~~ 

if (isIssueNumber((form.card_type.options[form.card_type.selectedIndex].value),(form.issue_number.value.length))) { 

alert("Please enter Issue Number" ); 

form.issue_number.focus(); 

return false; 

} 

~~~~~~~~~~~~~~~~~~~~~~~~~~

jduk · #10 03-22-2004, 07:25 AM

Hi Jaegernaut,

Great! It is working fine. Thank you so much for your help.

Thanks & Regards,

jaegernaut · #11 03-22-2004, 07:29 AM

You're Welcome.

I'm happy to help.

Thread Tools
Show Printable Version Email this Page
Display Modes	Rate This Thread
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode	Rate This Thread:

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)