Cannot get form to validate. please help

@bufhalAug 28.2006

HI;
I hope someone can take a look at this to see why this form will not validate.
What is supposed to happen is both the select box and certain fields have to be filled in for the form to go to the Perl script anf “thank you page” (jobs.pl).
But it keeps going to the jobs.pl page without sending up alerts for the two areas.
Can someone please take a look at the sections of code below and offer some feedback?
I really appreciate any help..
Thank you

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd“>
<html xmlns=”http://www.w3.org/1999/xhtml“><!– InstanceBegin template=”/Templates/standard.dwt” codeOutsideHTMLIsLocked=”false” –>
<head>
<link href=”/default.css” rel=”stylesheet” type=”text/css”>
<LINK REL=stylesheet HREF=”/atto.css” TYPE=”text/css”>
<style type=”text/css”>
body {
font: 12px tahoma;
background: #ffffff;
margin: 0;
padding: 5px;
}

</style>
<link rel=”stylesheet” type=”text/css” href=”/example1.css”/>
<script type=”text/javascript” src=”/ie5.js”></script>
<script type=”text/javascript” src=”/DropDownMenuX.js”></script>
<style type=”text/css”>
<!–
.style1 {font-size: 12px}
–>
</style><!– InstanceBeginEditable name=”doctitle” –>
<script language=”JavaScript” type=”text/javascript”>
<!–

function newImage(arg) {
if (document.images) {
rslt = new Image();
rslt.src = arg;
return rslt;
}
}

var preloadFlag = false;
function preloadImages() {
if (document.images) {
rollovered_01_over = newImage(“images/rollovered_01-over.gif”);
preloadFlag = true;
}
}

// –>
</script>

[CODE]<script type=”text/javascript”> function sbmt() { var i, j = 0, e = [], f = document.forms[0]; //for (i=0; i<f.PositionWanted.length; i++) //if (f.PositionWanted[i].selected) j = 1; if (!f.FIRST_NAME.value) e[e.length] = ‘First Name’; if (!f.MIDDLE_NAME.value) e[e.length] = ‘Middle Initial’; //if (!f.LAST_NAME.value) e[e.length] = ‘Last Name’; //if (!j) e[e.length] = ‘Position’; if (e[0]) { alert(‘Please fill in the following field’+(e[1]?’s’:”)+ ‘: ‘+e.join(‘, ‘)+’.’); return; } f.submit(); } </script> } [/CODE]

<title>Resume Submittal Form</title>
<!– InstanceEndEditable –>
<!– InstanceBeginEditable name=”head” –>
<style type=”text/css”>
<!–
.style1 {font-size: 14}
–>
</style>
<!– InstanceEndEditable –>
</head>
<body topmargin=”0″ leftmargin=”0″ marginheight=”0″ marginwidth=”0″>
<script type=”text/javascript” src=”/ie5.js”></script>
<script type=”text/javascript” src=”/DropDownMenuX.js”></script>
<TABLE border=”0″ bgcolor=”#FFFFFF” cellpadding=”0″ cellspacing=”0″ width=”815″>
<TR>
<TD><!– #BeginLibraryItem “/Library/leftlogo.lbi” –><a href=”/index.html”><img
src=”/images/leftlogo.gif” alt=”” border=”0″ valign=”top” /></a><!– #EndLibraryItem –><BR>
<BR><img src=”/images/spacer.gif” alt=”” width=”1″ valign=top height=”1″ align=left>
<!– InstanceBeginEditable name=”solutionsleftlinks” –><span class=”leftlink”><a href=”attoview.html”>   About ATTO</a><br />
  <a href=”press.html”>Press Room</a><br />
  <a href=”events.html”>Events</a><br />
  <a href=”job.html”>Job Opportunities</a><br />
  <a href=”contact.html”>Contact Us</a><br />
  <a href=”directions.html”>Map to ATTO</a><br />
  <a href=”attoimages.html”>ATTO Logo</a></span></div>
<!– InstanceEndEditable –>
</TD>
<TD valign=top><!– InstanceBeginEditable name=”solutionsheader” –>
<table width=”610″ height=”99″>
<tr>
<td width=”90%”><br />
<h2>Resume Submittal Form</h2></td>
<td align=”right” valign=”top”><p> </p>
<p>Position Applying For<br />
<select size=”4″ name=”PositionWanted” class=”contact2″>
<option value=”Electronic Assembler”>Electronic Assembler</option>
<option value=”Hardware Engineer”>Hardware Engineer</option>
<option value=”Marketing Assistants (Part-time)”>Marketing Assistants (Part-time)</option>
<option value=”Marketing Specialist”>Marketing Specialist</option>
<option value=”Product Manager”>Product Manager</option>
<option value=”Sales Representatives – Inside/Outside”>Sales Representatives – Insider/Outside</option>
<option value=”Senior Electronic Technician”>Senior Electronic Technician</option>
<option value=”Software/Systems Engineers”>Software/Systems Engineers</option>
<option value=”Other”>Other (Please Specify Below)</option>
</select>
</p></td>
</tr>
</table>
<!– InstanceEndEditable –>
<TABLE border=”0″ bgcolor=”#FFFFFF” cellpadding=”0″ cellspacing=”0″ ID=”Table3″>
<TR valign=top>
<TD width=600>
<div align=”justify”>
<!– InstanceBeginEditable name=”solutionsbody” –>

[CODE]<form action=”/cgi-bin/jobs.pl” method=”post” onsubmit=”sbmt();return false”> <input type=”hidden” name=”recipient” value=”[email protected]” /> <p><br /> </p> <table width=”100%” border=”1″ cellspacing=”0″ cellpadding=”2″ bordercolor=”#D9D9D9″ bordercolorlight=”#D9D9D9″ bordercolordark=”White”> <tr> <td width=”20%” class=”contact”>First Name*</td> <td><input maxlength=”64″ size=”45″ name=”FIRST_NAME” /></td> </tr> <tr> <td class=”contact”>Middle Initial</td> <td><input maxlength=”1″ size=”3″ name=”MIDDLE_NAME” /></td> </tr> <tr> <td class=”contact”>Last Name*</td> <td><input maxlength=”64″ size=”45″ name=”LAST_NAME” /></td> </tr> <tr> <td class=”contact”>Home Phone*</td> <td><input maxlength=”20″ size=”45″ name=”HOME_PHONE” />   <input type=”radio” checked=”checked” value=”1″ name=”PREFERRED_PHONE” /> Preferred Contact</td> </tr> <tr> <td class=”contact”>Cell Phone</td> <td><input maxlength=”20″ size=”45″ name=”CELL_PHONE” />   <input type=”radio” value=”3″ name=”PREFERRED_PHONE” /> Preferred Contact</td> </tr> <tr> <td class=”contact”>E-mail*</td> <td><input maxlength=”128″ size=”45″ name=”EMAIL” /></td> </tr> <tr> <td class=”contact”>Address*</td> <td><input maxlength=”128″ size=”45″ name=”PRIMARY_ADDR_1″ /></td> </tr> <tr> <td class=”contact”> </td> <td><input maxlength=”128″ size=”45″ name=”PRIMARY_ADDR_2″ /></td> </tr> <tr> <td class=”contact”>City*</td> <td><input maxlength=”128″ size=”45″ name=”CITY_1″ /></td> </tr> <tr> <td class=”contact”>State*</td> <td><input maxlength=”128″ size=”45″ name=”STATE_1″ /></td> </tr> <tr> <td class=”contact”>Zip/Postal Code*</td> <td><input maxlength=”10″ size=”45″ name=”ZIP_1″ /> </td> </tr> <tr> <td class=”contact”>Country</td> <td><input maxlength=”128″ size=”45″ name=”COUNTRY_1″ /></td> </tr> <tr> <td colspan=”2″ class=”contact2″><br /> Resume Text (Text only, no HTML)*</td> </tr> <tr> <td colspan=”2″ class=”contact2″><textarea name=”RESUME” rows=”15″ wrap=”hard” cols=”60″></textarea> </td> </tr> </table> <p>Thank you very much! &nbsp <input type=”submit” value=”submit” /> <input type=”reset” value=”clear” /> </p> </form> [/CODE]

<p> </p>
<p> </p>
<p> </p>
<p> </p>
<div class=”leftlink” align=”right” valign=”top”></div>
<!– InstanceEndEditable –></div>
</TD>
</TR>
</TABLE>
</TD>
</TR>
<TR>
<TD colspan=2>
<BR>
<BR><BR><!– #BeginLibraryItem “/Library/footer1.lbi” –>
<table cellpadding=”0″ cellspacing=”0″ border=”0″ width=”100%”>
<tr>
<td>
<!– Footer –>
<div class=”footer” align=”center”>
<a href=”/index.html”>Home</a> . <a href=”/sitemap.html”>Sitemap</a> .
<a href=”/contact.html”>Contact Us</a> . <a
href=”/search.html”>Search</a> . <a
href=”/newsletter.html”>Subscribe</a><br />
</div>
<!– /Footer –>
</td>
</tr>
</table><!– #EndLibraryItem –></TD>

</TR>
</TABLE>
<script type=”text/javascript”>
var ddmx = new DropDownMenuX(‘menu1’);
ddmx.delay.show = 0;
ddmx.delay.hide = 400;
ddmx.position.levelX.left = 2;
ddmx.init();
</script>

</body>
<!– InstanceEnd –></html>

to post a comment

JavaScript

10 Comments(s) _↴

@KorAug 28.2006 — #can u isolate the problem, please? It is a long code, u know...

@bufhalauthorAug 28.2006 — #Thanks Kor;

I posted most the page because I have been trying to get the JS working for sometime and wanted to give the "big picture" for any help.

The issue must be in the head JS, or the form (or both).

After I send up this page, I go to the site and click submit without filling any fields. The page goes directly to the "jobs.pl Perl script thank you page" without validating(sending up a dialog box alert). I am at a loss as to why this will not validate. I appreciate any help or ideas.

I have also highlighted the select box

Thank you, Kor

@EricWAug 28.2006 — #<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<link href="/default.css" rel="stylesheet" type="text/css">

<LINK REL=stylesheet HREF="/atto.css" TYPE="text/css">

<style type="text/css">

body {

font: 12px tahoma;

background: #ffffff;

margin: 0;

padding: 5px;

}

</style>

<link rel="stylesheet" type="text/css" href="/example1.css"/>

<script type="text/javascript" src="/ie5.js"></script>

<script type="text/javascript" src="/DropDownMenuX.js"></script>

<style type="text/css">



</style>

<script language="JavaScript" type="text/javascript">



</script>

Code:

<script type="text/javascript">

function sbmt() {

var i, j = 0, e = [], f = document.forms[0];

//for (i=0; i<f.PositionWanted.length; i++)

//if (f.PositionWanted[i].selected) j = 1;

if (!f.FIRST_NAME.value) e[e.length] = 'First Name';

if (!f.MIDDLE_NAME.value) e[e.length] = 'Middle Initial';

//if (!f.LAST_NAME.value) e[e.length] = 'Last Name';

//if (!j) e[e.length] = 'Position';

if (e[0]) {

alert('Please fill in the following field'+(e[1]?'s':'')+ ': '+e.join(', ')+'.');

return; }

f.submit();

}

</script>

<title>Resume Submittal Form</title>





<style type="text/css">



</style>



</head>

<body topmargin="0" leftmargin="0" marginheight="0" marginwidth="0">

<script type="text/javascript" src="/ie5.js"></script>

<script type="text/javascript" src="/DropDownMenuX.js"></script>

<TABLE border="0" bgcolor="#FFFFFF" cellpadding="0" cellspacing="0" width="815">

<TR>

<TD><a href="/index.html"><img

src="/images/leftlogo.gif" alt="" border="0" valign="top" /></a><BR>

<BR><img src="/images/spacer.gif" alt="" width="1" valign=top height="1" align=left>

<span class="leftlink"><a href="attoview.html">   About ATTO</a><br />

  <a href="press.html">Press Room</a><br />

  <a href="events.html">Events</a><br />

  <a href="job.html">Job Opportunities</a><br />

  <a href="contact.html">Contact Us</a><br />

  <a href="directions.html">Map to ATTO</a><br />

  <a href="attoimages.html">ATTO Logo</a></span></div>



</TD>

<TD valign=top>

<table width="610" height="99">

<tr>

<td width="90%"><br />

<h2>Resume Submittal Form</h2></td>

<td align="right" valign="top"><p> </p>

<p>Position Applying For<br />

<select size="4" name="PositionWanted" class="contact2">

<option value="Electronic Assembler">Electronic Assembler</option>

<option value="Hardware Engineer">Hardware Engineer</option>

<option value="Marketing Assistants (Part-time)">Marketing Assistants (Part-time)</option>

<option value="Marketing Specialist">Marketing Specialist</option>

<option value="Product Manager">Product Manager</option>

<option value="Sales Representatives - Inside/Outside">Sales Representatives - Insider/Outside</option>

<option value="Senior Electronic Technician">Senior Electronic Technician</option>

<option value="Software/Systems Engineers">Software/Systems Engineers</option>

<option value="Other">Other (Please Specify Below)</option>

</select>

</p></td>

</tr>

</table>



<TABLE border="0" bgcolor="#FFFFFF" cellpadding="0" cellspacing="0" ID="Table3">

<TR valign=top>

<TD width=600>

<div align="justify">



Code:

<form action="/cgi-bin/jobs.pl" method="post" onsubmit="sbmt();return false"> <input type="hidden" name="recipient" value="[email protected]" /> <p><br /> </p> <table width="100%" border="1" cellspacing="0" cellpadding="2" bordercolor="#D9D9D9" bordercolorlight="#D9D9D9" bordercolordark="White"> <tr> <td width="20%" class="contact">First Name*</td> <td><input maxlength="64" size="45" name="FIRST_NAME" /></td> </tr> <tr> <td class="contact">Middle Initial</td> <td><input maxlength="1" size="3" name="MIDDLE_NAME" /></td> </tr> <tr> <td class="contact">Last Name*</td> <td><input maxlength="64" size="45" name="LAST_NAME" /></td> </tr> <tr> <td class="contact">Home Phone*</td> <td><input maxlength="20" size="45" name="HOME_PHONE" />   <input type="radio" checked="checked" value="1" name="PREFERRED_PHONE" /> Preferred Contact</td> </tr> <tr> <td class="contact">Cell Phone</td> <td><input maxlength="20" size="45" name="CELL_PHONE" />   <input type="radio" value="3" name="PREFERRED_PHONE" /> Preferred Contact</td> </tr> <tr> <td class="contact">E-mail*</td> <td><input maxlength="128" size="45" name="EMAIL" /></td> </tr> <tr> <td class="contact">Address*</td> <td><input maxlength="128" size="45" name="PRIMARY_ADDR_1" /></td> </tr> <tr> <td class="contact"> </td> <td><input maxlength="128" size="45" name="PRIMARY_ADDR_2" /></td> </tr> <tr> <td class="contact">City*</td> <td><input maxlength="128" size="45" name="CITY_1" /></td> </tr> <tr> <td class="contact">State*</td> <td><input maxlength="128" size="45" name="STATE_1" /></td> </tr> <tr> <td class="contact">Zip/Postal Code*</td> <td><input maxlength="10" size="45" name="ZIP_1" /> </td> </tr> <tr> <td class="contact">Country</td> <td><input maxlength="128" size="45" name="COUNTRY_1" /></td> </tr> <tr> <td colspan="2" class="contact2"><br /> Resume Text (Text only, no HTML)*</td> </tr> <tr> <td colspan="2" class="contact2"><textarea name="RESUME" rows="15" wrap="hard" cols="60"></textarea> </td> </tr> </table> <p>Thank you very much! &nbsp <input type="submit" value="submit" /> <input type="reset" value="clear" /> </p> </form>

<p> </p>

<p> </p>

<p> </p>

<p> </p>

<div class="leftlink" align="right" valign="top"></div>

</div>

</TD>

</TR>

</TABLE>

</TD>

</TR>

<TR>

<TD colspan=2>

<BR>

<BR><BR>

<table cellpadding="0" cellspacing="0" border="0" width="100%">

<tr>

<td>



<div class="footer" align="center">

<a href="/index.html">Home</a> . <a href="/sitemap.html">Sitemap</a> .

<a href="/contact.html">Contact Us</a> . <a

href="/search.html">Search</a> . <a

href="/newsletter.html">Subscribe</a><br />

</div>



</td>

</tr>

</table></TD>

</TR>

</TABLE>

<script type="text/javascript">

var ddmx = new DropDownMenuX('menu1');

ddmx.delay.show = 0;

ddmx.delay.hide = 400;

ddmx.position.levelX.left = 2;

ddmx.init();

</script>

</body>

</html>

@bufhalauthorAug 28.2006 — #Thanks a million, Eric. The First, Middle and Last Name fields are working. However, the "Position Wanted" field in the selection box is not in the alert. I am uncommenting as I go, but every combination I uncomment causes the form to go to the Perl thank you page...

could it be the "class="contact2"?

[B]select size="4" name="PositionWanted" class="contact2">[/B]

<script type="text/javascript">

function sbmt() {

var i, j = 0, e = [], f = document.forms[0];

//for (i=0; i<f.PositionWanted.length; i++)

//if (f.PositionWanted[i].selected) j = 1;

if (!f.FIRST_NAME.value) e[e.length] = 'First Name';

if (!f.MIDDLE_NAME.value) e[e.length] = 'Middle Initial';

if (!f.LAST_NAME.value) e[e.length] = 'Last Name';

//if (!j) e[e.length] = 'Position';

if (e[0]) {

alert('Please fill in the following field'+(e[1]?'s':'')+ ': '+e.join(', ')+'.');

return; }

f.submit();

}

</script>

@EricWAug 28.2006 — #<script>

function test() {

value=document.getElementById("PositionWanted").value;

if (value+'X'=='X') {

alert('please select a position');

} else {

alert("you have selected: "+value);

}

}

</script>

<select size="4" id="PositionWanted" name="PositionWanted" class="contact2">

<option value="Electronic Assembler">Electronic Assembler</option>

<option value="Hardware Engineer">Hardware Engineer</option>

<option value="Marketing Assistants (Part-time)">Marketing Assistants (Part-time)</option>

<option value="Marketing Specialist">Marketing Specialist</option>

<option value="Product Manager">Product Manager</option>

<option value="Sales Representatives - Inside/Outside">Sales Representatives - Insider/Outside</option>

<option value="Senior Electronic Technician">Senior Electronic Technician</option>

<option value="Software/Systems Engineers">Software/Systems Engineers</option>

<option value="Other">Other (Please Specify Below)</option>

</select>

<input type=button value='click me' onclick="test()">

@bufhalauthorAug 28.2006 — #Thanks Eric. How can I get the [B]current form[/B] to validate the select box in conjunction with the other fields. I am sorry for my lack of experience. ?

Your test script works and I am hoping to get the bottom submit form button to validate the select box in conjuntion with the other form fields. Please let me know how this can be done.

Thank you Eric...

@EricWAug 28.2006 — #function sbmt() {

if (document.getElementById("PositionWanted").value+'X'=='X') {

alert('Please select a "Position Applying For"');

return;

}

}

@bufhalauthorAug 29.2006 — #Hi Eric;

I have tried to use the last script you posted alon in a seperate head section as well as incorporating with the existing code (below).

do I need an "else" statement or something?

It is still going to the Perl script.

Thank you for hanging in there, I appreciate your time and expertise...

[CODE]<script type="text/javascript"> 
 function sbmt() { 
 var i, j = 0, e = [], f = document.forms[0]; 
 //for (i=0; i<f.PositionWanted.length; i++) 
 //if (f.PositionWanted[i].selected) j = 1; 
 
 [B]if (document.getElementById("PositionWanted").value+'X'=='X') {
 alert('Please select a "Position Applying For"'); [/B] 
 if (!f.FIRST_NAME.value) e[e.length] = 'First Name'; 
 if (!f.MIDDLE_NAME.value) e[e.length] = 'Middle Initial'; 
 if (!f.LAST_NAME.value) e[e.length] = 'Last Name'; 
 //if (!j) e[e.length] = 'Position'; 
 if (e[0]) {
 alert('Please fill in the following field'+(e[1]?'s':'')+ ': '+e.join(', ')+'.'); 
 return; } 
 f.submit(); 
 }
 </script>[/CODE]

@EricWAug 29.2006 — #sorry about that...

<script type="text/javascript">

function sbmt() {

var i, j = 0, e = [], f = document.forms[0];

alert('Please select a "Position Applying For"');

if (!f.FIRST_NAME.value) e[e.length] = 'First Name';

if (!f.MIDDLE_NAME.value) e[e.length] = 'Middle Initial';

if (!f.LAST_NAME.value) e[e.length] = 'Last Name';

if (document.getElementById("PositionWanted").value+'X'=='X') e[e.length] = 'Position';

if (e[0]) {

alert('Please fill in the following field'+(e[1]?'s':'')+ ': '+e.join(', ')+'.');

return; }

f.submit();

}

</script>

@bufhalauthorAug 29.2006 — #Got it working! Thank you very much, Eric..... ?

Also in #JavaScript _↴

href not working in expl 6 Digital Clock HTTP Request - Help

Success!

Help @bufhal spread the word by sharing this article on Twitter...

Tweet This

Cannot get form to validate. please help

10 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

Cannot get form to validate. please help

10 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

10 Comments(s) _↴

Also in #JavaScript _↴