Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

For Validation script isn't working right 1

Status
Not open for further replies.

SlowFlight

Programmer
Jan 2, 2003
33
US
Hi,
I have an event sign up form at:
The scripting in the header checks to make certain that required fields are completed. And if the field "sailDrive" has "Sailing" selected rather than "Driving" then two other options become required.

My problem is that several people have complained that the script seems to be hanging up when they select either "sailing" or "Driving". I only just now checked the form in Internet Explorer. It hangs up there but not in my browser of choice (Firefox). Can someone please suggest a fix or work-around so I don't have to disable that part of the script?
Thanks!
Skip

SV "Slow Flight"
1977 Catalina 22 Swing Keel
 
when referring to a select box's value, the correct way to do so is like this:

Code:
var theSel = document.forms['formName'].elements['selectName'];
alert( theSel.options[theSel.selectedIndex].value );

*cLFlaVA
----------------------------
[tt]a frickin' twelve-gauge, what do you think?[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
[banghead]
 
Well, now that I made that edit (I think I did it right) the form will submit no matter what is or isn't entered anywhere in the form. HELP!

SV "Slow Flight"
1977 Catalina 22 Swing Keel
 
Here is the complete function:
Code:
	function checkMandatory()
	{
	var error_string = "";
	var the_email = window.document.eventEntryForm.eMail.value;
    var the_at = the_email.indexOf("@");
    var the_dot = the_email.lastIndexOf(".");
    var a_space = the_email.indexOf(" ");
	if (window.document.eventEntryForm.eMail.value == "")
		{ error_string += "You must give an email address.\n"; }
	if ((the_at != -1) &&  // if there's an '@'
        (the_at != 0) &&  // and it's not at position 0
        (the_dot != -1) && // and there's a '.'
        (the_dot > the_at + 1) &&  // and something between the '@' and '.'
        (the_dot < the_email.length - 1) && // and something after the '.'
        (a_space  == -1))  // and there're no spaces
		{ error_string += ""; }
		else
		{ error_string += "The email address must be valid.\n"; }
	if (window.document.eventEntryForm.visitorName.value == "")
		{ error_string += "You must give your Name.\n"; }
	if (window.document.eventEntryForm.boatName.value == "")
		{ error_string += "You must give your boat name.\n"; }
	if (window.document.eventEntryForm.partySize.value == "")
		{ error_string += "How many in your party?\n"; }
	if (window.document.eventEntryForm.arrival.value == "")
		{ error_string += "When do you expect to arrive?\n"; }
	if (window.document.eventEntryForm.departure.value == "")
		{ error_string += "When do you expect to depart?\n"; }
	[b]if (window.document.forms[eventEntryForm].elements['sailDrive'].value == "")
		{ error_string += "Will you be sailing in or driving?\n"; }
	if (window.document.forms[eventEntryForm].elements['sailDrive'].value == "Sailing")
		{	if (window.document.eventEntryForm.boatLength.value == "")
				{ error_string += "What is your boat length?\n"; }
			if (window.document.eventEntryForm.boatBeam.value == "")
				{ error_string += "What is your boat beam?\n"; } }[/b]
  if (error_string == "")
    {
    document.eventEntryForm.sender.value = document.eventEntryForm.visitorName.value;
    return true; }
		else
		{ error_string = "We found the following ommisions in your form: \n\n" + error_string;
		alert(error_string);
		return false; }
	}
Only the "sailDrive" section was causing the original problem. How do I need to change this?

SV "Slow Flight"
1977 Catalina 22 Swing Keel
 
I got this to work in both ie and firefox, I removed the action label from the form tag so that I could run it locally on my machine.
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">[/URL]

<html xmlns="[URL unfurl="true"]http://www.w3.org/1999/xhtml"[/URL] xml:lang="en" lang="en">
<head>
   <title>Cascadia Events Entry Form</title>
   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
   <link rel="stylesheet" href="styles/main.css" />
   <script language ="JavaScript">
   function checkMandatory() {
      var frm = document.getElementById("eventEntryForm");
      var error_string = "";
      var the_email = frm.elements["eMail"].value;
      var the_at = the_email.indexOf("@");
      var the_dot = the_email.lastIndexOf(".");
      var a_space = the_email.indexOf(" ");
      if (frm.elements["eMail"].value == "") {
         error_string += "You must give an email address.\n"; 
      }
      if ((the_at != -1) && (the_at != 0) && (the_dot != -1) && (the_dot > the_at + 1) && (the_dot < the_email.length - 1) && (a_space  == -1)) {
         error_string += "";
      }
      else {
         error_string += "The email address must be valid.\n"; 
      }
      if (frm.elements["visitorName"].value == "") {
         error_string += "You must give your Name.\n"; 
      }
      if (frm.elements["boatName"].value == "") {
         error_string += "You must give your boat name.\n"; 
      }
      if (frm.elements["partySize"].value == "") {
         error_string += "How many in your party?\n"; 
      }
      if (frm.elements["arrival"].value == "") {
         error_string += "When do you expect to arrive?\n"; 
      }
      if (frm.elements["departure"].value == "") {
         error_string += "When do you expect to depart?\n";
      }
      if (frm.elements["sailDrive"].value == "") {
         error_string += "Will you be sailing in or driving?\n"; 
      }
      if (frm.elements['sailDrive'].value == "Sailing") {
         if (frm.elements["boatLength"].value == "") {
            error_string += "What is your boat length?\n"; 
         }
         if (frm.elements["boatBeam"].value == "") {
            error_string += "What is your boat beam?\n"; 
         }
      }
      if (error_string == "") {
         frm.elements["sender"].value = frm.elements["visitorName"].value;
         return true; 
      }
      else {
         error_string = "We found the following ommisions in your form: \n\n" + error_string;
         alert(error_string);
         return false;
      }
   }
   </script>
</head>
<body>

<div align="center">
<table width="740">
   <tr>
      <td>
      <table width="100%">
         <tr>
            <td align="left"><a href="[URL unfurl="true"]http://www.burgees.com/burgeeframe.htm"><img[/URL] src="images/tn-burgee.gif" width="233" height="150" border="0" alt="Cascadia Burgee" /></a></td>
            <td valign="middle"><h1>Cascadia</h1></td>
         </tr>

      </table>
      <table>
         <tr>
            <td width="200" align="left" valign="top">
            <h3 class="left">Links</h3>
            <hr align="left" width="70%" />
            <p><a href="index.html">Home</a></p>
            <p><a href="news-events.html">News &amp; Events</a></p>

            <p><a href="images/faces/faces.html">Faces of Cascadia</a></p>
            <p><a href="images/boats/boats.html">Boats of Cascadia</a></p>
            <p><a href="images/pets/pets.html">Pets of Cascadia</a></p>
            <p><a href="images/NameTags/nametags.html">Name Tags</a></p>
            <hr align="left" width="70%" />
            <h3 class="left">Sail-In Photos</h3>

            <p><a href="[URL unfurl="true"]http://groups.msn.com/ObliosPlace/heartsday.msnw">HEARTS[/URL] Feb. 2004</a></p>
            <p><a href="images/si/Filucy-04/01.html">Filucy May 2004</a></p>
            <p><a href="[URL unfurl="true"]http://spunt.aigc.net/gallery/album92">Poulsbo[/URL] Nov. 2004</a></p>
            <p><a href="images/si/PT-02-05/index.html">P.T. Feb 2005</a></p>
            <hr align="left" width="70%" />
            <h3 class="left">Member's Pages</h3>

            <p><a href="[URL unfurl="true"]http://slowflight.net/upgrades">Skip's[/URL] Upgrades</a></p>
            <p><a href="[URL unfurl="true"]http://www.familyyachtclub.com/">Family[/URL] Yacht Club</a></p>
            <p><a href="[URL unfurl="true"]http://spunt.aigc.net/gallery/Adoption01">Adam's[/URL] Adoption</a></p>
            <p><a href="[URL unfurl="true"]http://sedge.net/pod/spitz/CascadiaBurgee.jpg">Fly[/URL] Your Burgee</a></p>
            <p><a href="[URL unfurl="true"]http://home.earthlink.net/~oday302/">Greg's[/URL] Parenthood</a></p>
            <p><a href="[URL unfurl="true"]http://www.tgw.net/sailing/">Tim's[/URL] Sailing Stories</a></p>

            <p><a href="drifter.html">Maria, Chris &amp; &quot;Drifter&quot;</a></p>
            <p><a href="[URL unfurl="true"]http://www.daveandbarb.com/">Dave[/URL] &amp; Barb</a></p>
            <p><a href="[URL unfurl="true"]http://home.comcast.net/~jimtriad/wsb/html/view.cgi-home.html-.html">Jim[/URL] and Debbie Lee</a></p>
            <p><a href="[URL unfurl="true"]http://www.puddlehaven.com/Sailing/">Chuck[/URL] Bigham</a></p>
            <p><a href="[URL unfurl="true"]http://homepage.mac.com/ksfischer/solaria/Menu33.html">Ken[/URL] Fischer</a></p>

            <hr align="left" width="70%" />
            <h3 class="left">Misc.</h3>
            <p><a href="[URL unfurl="true"]http://www.northwestwatch.org/images/photos/bioregion2004.jpg">Map[/URL] of Cascadia</a></p>
            <p><a href="[URL unfurl="true"]wwwww.html">WWWWW</a></p>[/URL]
            <hr align="left" width="70%" />
            </td>
            <td valign="top">

      <h2 class="centr">The 2nd Annual<br />Cascadia/PacNorthwest<br />
      Filucy Bay<br />
      Drive in - Sail in</h2>
            <h4>Friday, Saturday and Sunday, May 20<sup>th</sup>, 21<sup>st</sup> &amp; 22<sup>nd</sup> 2005</h4>

            <h3>ENTRY FORM</h3>
            <form method="post" name="eventEntryForm" id="eventEntryForm" onsubmit="return checkMandatory();">
               <input type="hidden" name="sender" id="sender" value="Cascadia Cruise Entry Form" />
               <input type="hidden" name="recipient" id="recipient" value="meischa3@verizon.net" />
               <input type="hidden" name="subject" id="subject" value="Cascadia Cruise Entry Form" />
               <input type="hidden" name="backpage" id="backpage" value="[URL unfurl="true"]http://slowflight.net/cascadia/thank-you.html"[/URL] />
            <table width="400">
               <tr>

                  <td colspan="2"><p align="center">Please complete this form. Click on Submit when ready to send.
                  </p><p>
                  If, for any reason, this form does not work on your computer... please send the required information to Pamela Benson. You can get her email address from the Cascadia email list.
                  </p></td>
               </tr>
               <tr>
                  <td colspan="2"><p align="center">(<font color="#ff0000">Red items </font>) indicate a required field.
                  </p></td>
               </tr>

               <tr>
                  <td align="right"><font color="#ff0000">Your Name </font></td>
                  <td align="left"><input type="text" size="40" name="visitorName" id="visitorName" /></td>
               </tr>
               <tr>
                  <td align="right"><font color="#ff0000">Boat Name </font></td>
                  <td align="left"><input type="text" size="40" name="boatName" id="boatName" /></td>
               </tr>

               <tr>
                  <td align="right"><font color="#ff0000">E-mail address </font></td>
                  <td align="left"><input type="text" size="40" name="eMail" id="eMail" /></td>
               </tr>
               <tr>
                  <td align="right"><font color="#ff0000">How many in your party? </font></td>
                  <td align="left"><input type="text" size="40" name="partySize" id="partySize" /></td>
               </tr>

               <tr>
                  <td align="right"><font color="#ff0000">When do you expect to arrive? </font></td>
                  <td align="left"><input type="text" size="40" name="arrival" id="arrival" /></td>
               </tr>
               <tr>
                  <td align="right"><font color="#ff0000">When do you expect to depart? </font></td>
                  <td align="left"><input type="text" size="40" name="departure" id="departure" /></td>
               </tr>

               <tr>
                  <td align="right"><font color="#ff0000">Will you be sailing in or driving? </font></td>
                  <td align="left"><select name="sailDrive" id="sailDrive" size="1">
                     <option></option>
                     <option>Sailing</option>
                     <option>Driving</option>
                  </select></td>

               </tr>
               <tr>
                  <td align="right"><p>If Sailing:</p></td>
                  <td align="left">&nbsp;</td>
               </tr>
               <tr>
                  <td align="right"><font color="#ff0000">Boat Length </font></td>
                  <td align="left"><input type="text" size="10" name="boatLength" id="boatLength" /></td>

               </tr>
               <tr>
                  <td align="right"><font color="#ff0000">Boat Beam </font></td>
                  <td align="left"><input type="text" size="10" name="boatBeam" id="boatBeam" /></td>
               </tr>
               <tr>
                  <td align="right">Comments: What activities do you expect to attend? </td>
                  <td align="left"><textarea name="activities" id="activities" cols="30" rows="5"></textarea>

               </tr>
               <tr>
                  <td colspan="2" align="center">
                     <input type="submit" name="submit" id="submit" value="Submit" />
                     <input type="reset" name="reset" id="reset" value="Reset Form" />
                  </td>
               </tr>
            </table>
            </form>

            </td>
         </tr>
      </table>
   </tr>
</table>

</div>

</body>
</html>

-kaht

Do the chickens have large talons?
[banghead]
 
I copied and pasted it as is with the exception of putting the action label back into the form tag.
MS IE still gives me the error message that the sailDrive element has not been completed.

SV "Slow Flight"
1977 Catalina 22 Swing Keel
 
You didn't take clflava's advice about the validation for the dropdown. You need to use the .options method, put this code into your function in the appropriate place:
Code:
      if (frm.elements["sailDrive"].[b][COLOR=red]options[frm.elements["sailDrive"].selectedIndex].[/color][/b]value == "") {
         error_string += "Will you be sailing in or driving?\n";
      }
      if (frm.elements['sailDrive'].[b][COLOR=red]options[frm.elements["sailDrive"].selectedIndex].[/color][/b]value == "Sailing") {
         if (frm.elements["boatLength"].value == "") {
            error_string += "What is your boat length?\n";
         }
         if (frm.elements["boatBeam"].value == "") {
            error_string += "What is your boat beam?\n";
         }
      }

-kaht

Do the chickens have large talons?
[banghead]
 
kaht & clflava,

Ok... I made that change (copy and paste).
It still gives the error that the sailDrive field has not been entered. It does not work in IE.

Skip

SV "Slow Flight"
1977 Catalina 22 Swing Keel
 

Your first option has no value... try giving it a blank value:

Code:
<option value=""></option>

Hope this helps,
Dan


[tt]D'ya think I got where I am today because I dress like Peter Pan here?[/tt]
[banghead]

 

Oops.. I man NONE of them have values - give them all values. You are testing to see if the value is blank or not - and it always is.

If you don't want to use values (which you should, otherwise the server-side code will never know what was selected), then test for ".text" instead.

Hope this helps,
Dan


[tt]D'ya think I got where I am today because I dress like Peter Pan here?[/tt]
[banghead]

 
Thanks a bunch BillyRay. That seems to have solved the problem.

Skip

SV "Slow Flight"
1977 Catalina 22 Swing Keel
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top