•
•
•
•
What is DaniWeb IT Discussion Community?
You're currently browsing the JavaScript / DHTML / AJAX section within the Web Development category of DaniWeb, a massive community of 402,860 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 2,943 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.
Please support our JavaScript / DHTML / AJAX advertiser: Lunarpages Web Hosting
Views: 1499 | Replies: 5
 |
•
•
Join Date: Sep 2005
Location: St. Louis
Posts: 145
Reputation: 
Rep Power: 3
Solved Threads: 0
Junior Poster
Form Validation Issues I'm trying to validate some things on this form. (I've omitted some of the totally uneccesary code below. I'm first trying to tackle the "card" radio buttons. When I hit the submit button, it's just sitting on the whole thing. Can't figure out what I'm doing wrong here:
<html>
<head><title>Kahaj's Hardware and More</title>
<script type="text/javascript">
<!-- HIDE FROM IMCOMPATIBLE BROWSERS
window.defaultStatus = "Kahaj's Hardware and More";
function confirmSubmit() {
var cardChoice = false;
for (var i=0; i<2; ++i) {
if (document.forms[0].card[i].checked == true) {
cardChoice = true;
break;
}
}
if (cardChoice = false) {
window.alert("Please select payment method.");
return true;
}
else
return false;
}
function confirmReset() {
var resetForm = window.confirm("Are you sure you want to clear all of the above contents?");
if (resetForm == true)
return true;
return false;
}
// STOP HIDING FROM INCOMPATIBLE BROWSERS -->
</script></head>
<body>
<p><div align="center"><font size="6" face="Garramond">Kahaj's Hardware and More</font></div></p><br /><br />
<p><font size="4">Choose from the items below what you want to order. Be sure to fill in your<br />
personal information. Then, you'll be ready to submit your order.</font></p><br /><br />
<form action="http://localhost/cgi-bin/kahajsHW.cgi" method="post" onreset="return confirmReset();" onsubmit="return confirmSubmit();">
<!************************************BILLING INFO****************************************>
<p><div align="center" /><font size="4" face="Arial"> Billing Information:</font></div></p><br />
<table width="85%" border="0">
<tr>
<td width="24%">
 
</td>
<td width="38%" valign="top">
<font size="3">
<p>Payment method:<br />
<input type="radio" name="card" value="cCard" />Credit Card<br />
<input type="radio" name="card" value="dCard" />Debit Card</p><br />
<p>Card number:<br />
<input type="text" name="cardNumber" size="18" maxlength="16"></p><br />
<p>Expiration date: (mmyy)<br />
<input type="text" name="expDate" size="5" maxlength="4"></p><br />
</td>
<td width="38%" valign="top">
<p>Billing Address:<br />
Street Address 1: <input type="text" name="bAdd1" size="20"><br />
Street Address 2: <input type="text" name="bAdd2" size="20"><br />
City: <input type="text" name="bCity" size="20"><br />
State: <input type="text" name="bState" size="3" maxlength="2"><br />
Zip Code: <input type="text" name="bZip" size="7" maxlength="5"></p><br />
<p>Name as it Appears on Card:<br />
First Name: <input type="text" name="bFirstName" size="10"><br />
Middle Initial (if applicable): <input type="text" name="bMI" size="2" maxlength="1"><br />
Last Name: <input type="text" name="bLastName" size="15"></p><br /><br />
</td>
</tr>
</table><br /><br />
<hr width="85%"><br /><br />
<!**************************************SHIPPING INFO***********************************>
<p><div align="center" /><font size="4" face="Arial"> Shipping Information:</font></div></p><br />
<table width="85%" border="0">
<tr>
<td width="24%">
 
</td>
<td width="38%" valign="top">
<p>Person Being Shipped To:<br />
First Name: <input type="text" name="sFirstName" size="10"><br />
Last Name: <input type="text" name="sLastName" size="15"></p><br />
</td>
<td width="38%" valign="top">
<p>Shipping Address:<br />
Street Address 1: <input type="text" name="sAdd1" size="20"><br />
Street Address 2: <input type="text" name="sAdd2" size="20"><br />
City: <input type="text" name="sCity" size="20"><br />
State: <input type="text" name="sState" size="3" maxlength="2"><br />
Zip Code: <input type="text" name="sZip" size="7" maxlength="5"></p><br />
</td>
</tr>
</table>
<p><input type="reset" value="Clear Form" /> <input type="submit" value="Submit Order" /></p>
</form>
</font>
</body>
</html>
•
•
Join Date: Jun 2006
Location: India
Posts: 6,816
Reputation: 
Rep Power: 23
Solved Threads: 339
>
>
> // STOP HIDING FROM INCOMPATIBLE BROWSERS -->
Not needed. Almost all modern browsers support javascript nowadays. If you still want to play it safe, use a <noscript> tag instead.
You are not using stylesheets which is a bad idea in itself. Separation of presentation, data and logic is crucial for todays' web apps. Also consider linking to an external script file.
Always use a validator to check the validity of the web pages you author. I would save both yours as well as the time of the person helping you out once it is known that the web page is a valid one. Consider keeping a DOCTYPE at the top of your page and validating against it using the online validator.
<!*************SHIPPING INFO*********************>
Your commenting is off. It should be:<!--*************SHIPPING INFO*********************-->
>
if (cardChoice = false)
You are assigning a value of false to cardChoice and then testing it, hence this condition would never be true irrespective of the value of cardChoice before. Maybe if(!cardChoice) is what you wanted to do.> // STOP HIDING FROM INCOMPATIBLE BROWSERS -->
Not needed. Almost all modern browsers support javascript nowadays. If you still want to play it safe, use a <noscript> tag instead.
You are not using stylesheets which is a bad idea in itself. Separation of presentation, data and logic is crucial for todays' web apps. Also consider linking to an external script file.
Always use a validator to check the validity of the web pages you author. I would save both yours as well as the time of the person helping you out once it is known that the web page is a valid one. Consider keeping a DOCTYPE at the top of your page and validating against it using the online validator.
"I don't accept change. I don't deserve to live."
"Working a real job is a win if you're lazy, greedy, or unmotivated. If you're average, you fit right in. And if you're above average, the basic terms of employment and premise of the arrangement is against your interests."
"Working a real job is a win if you're lazy, greedy, or unmotivated. If you're average, you fit right in. And if you're above average, the basic terms of employment and premise of the arrangement is against your interests."
•
•
Join Date: Sep 2005
Location: St. Louis
Posts: 145
Reputation:
Rep Power: 3
Solved Threads: 0
Junior Poster
I don't know what's going on with this. I must be totally missing something. It's giving the alert box whether you've clicked a radio button or not.
<html>
<head><title>Case Project 5-3 and 5-4</title>
<script type="text/javascript">
window.defaultStatus = "Kahaj's Hardware and More";
function confirmSubmit() {
var cardChoice = document.getElementById("card");
if (!cardChoice.checked) {
window.alert("Please select payment method.");
return false;
}
else {
return true;
}
}
function confirmReset() {
var resetForm = window.confirm("Are you sure you want to clear all of the above contents?");
if (resetForm == true)
return true;
return false;
}
</script></head>
<body>
<form action="http://localhost/cgi-bin/kahajsHW.cgi" method="post" onreset="return confirmReset();" onsubmit="return confirmSubmit();">
<!--************************************BILLING INFO****************************************-->
<p><div align="center" /><font size="4" face="Arial"> Billing Information:</font></div></p><br />
<table width="85%" border="0">
<tr>
<td width="24%">
 
</td>
<td width="38%" valign="top">
<font size="3">
<p>Payment method:<br />
<input type="radio" name="card" value="cCard" />Credit Card<br />
<input type="radio" name="card" value="dCard" />Debit Card</p><br />
<p>Card number:<br />
<input type="text" name="cardNumber" size="18" maxlength="16"></p><br />
<p>Expiration date: (mmyy)<br />
<input type="text" name="expDate" size="5" maxlength="4"></p><br />
</td>
<td width="38%" valign="top">
<p>Billing Address:<br />
Street Address 1: <input type="text" name="bAdd1" size="20"><br />
Street Address 2: <input type="text" name="bAdd2" size="20"><br />
City: <input type="text" name="bCity" size="20"><br />
State: <input type="text" name="bState" size="3" maxlength="2"><br />
Zip Code: <input type="text" name="bZip" size="7" maxlength="5"></p><br />
<p>Name as it Appears on Card:<br />
First Name: <input type="text" name="bFirstName" size="10"><br />
Middle Initial (if applicable): <input type="text" name="bMI" size="2" maxlength="1"><br />
Last Name: <input type="text" name="bLastName" size="15"></p><br /><br />
</td>
</tr>
</table>
<p><input type="reset" value="Clear Form" /> <input type="submit" name="submit" value="Submit Order" /></p>
</form>
</font>
</body>
</html> •
•
Join Date: Jan 2007
Posts: 2,537
Reputation:
Rep Power: 7
Solved Threads: 111
If you want the code to wait until a box is checked, you have to use a loop.
Daylight-saving time uses more gasoline
•
•
Join Date: Sep 2005
Location: St. Louis
Posts: 145
Reputation:
Rep Power: 3
Solved Threads: 0
Junior Poster
In comparing the code which I previously posted with the following code, I can't see what is different between the two. The one below is working fine fore me, while the previous one isn't.
[code]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtmll/DTD/xhtmll-transitional.dtd">
<!--accept.html-->
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head><title>Agreement Page</title>
<script type="text/javascript">
function confirmSubmit() {
var acc = document.getElementById("accept");
if (!acc.checked) {
alert("You must agree with the above items in order to utilize the statistics form.");
return false;
} else {
return true;
}
}
</script></head>
<body bgcolor="#CCCCCC">
<p>Do you accept the terms as outlined above?<br />
<form action="nflStats.html" method="post" onsubmit="return confirmSubmit();">
<input type="checkbox" name="accept" value="Accepted" />I Accept<br /><br />
<input type="submit" name="proceed" value="Proceed">
</form></p>
</body>
</html>
[code]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtmll/DTD/xhtmll-transitional.dtd">
<!--accept.html-->
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head><title>Agreement Page</title>
<script type="text/javascript">
function confirmSubmit() {
var acc = document.getElementById("accept");
if (!acc.checked) {
alert("You must agree with the above items in order to utilize the statistics form.");
return false;
} else {
return true;
}
}
</script></head>
<body bgcolor="#CCCCCC">
<p>Do you accept the terms as outlined above?<br />
<form action="nflStats.html" method="post" onsubmit="return confirmSubmit();">
<input type="checkbox" name="accept" value="Accepted" />I Accept<br /><br />
<input type="submit" name="proceed" value="Proceed">
</form></p>
</body>
</html>
•
•
Join Date: Jun 2006
Location: India
Posts: 6,816
Reputation:
Rep Power: 23
Solved Threads: 339
Both the snippets you posted are fundamentally broken in the sense they supply a non-existent
Just because the second snippet works doesn't mean it is not broken. IE and Opera display a strange behavior in that they are capable of fetching the element using the
To fix your code, just assign an id to your element and everything should turn out to be fine.
'id' to the function getElementById() which returns an element based on id supplied to it.Just because the second snippet works doesn't mean it is not broken. IE and Opera display a strange behavior in that they are capable of fetching the element using the
getElementById() function even when it is supplied a name. This behavior is not to be relied on.To fix your code, just assign an id to your element and everything should turn out to be fine.
"I don't accept change. I don't deserve to live."
"Working a real job is a win if you're lazy, greedy, or unmotivated. If you're average, you fit right in. And if you're above average, the basic terms of employment and premise of the arrangement is against your interests."
"Working a real job is a win if you're lazy, greedy, or unmotivated. If you're average, you fit right in. And if you're above average, the basic terms of employment and premise of the arrangement is against your interests."
|
•
•
•
•
•
•
•
•
DaniWeb JavaScript / DHTML / AJAX Marketplace
•
•
•
•
Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
Linear Mode
- Simple JavavScript needs email validation (JavaScript / DHTML / AJAX)
- PHP: Form Validation (PHP)
- uregnt need of form validation (JSP)
- sample code for form validation using ajax (JavaScript / DHTML / AJAX)
- .net validation/javascript conflict (ASP.NET)
- PHP Form Validation ??? (PHP)
- help with form/ display issues (ColdFusion)
- form validation not working (JavaScript / DHTML / AJAX)
Other Threads in the JavaScript / DHTML / AJAX Forum
- Previous Thread: Java Help
- Next Thread: Pulling data into another <td>
