form validation not working

Question

Secret Agent 0 Newbie Poster

19 Years Ago

This is my form script which has one simple problem that I do not know how to fix. If the name/email fields are left empty, it confirms this in a pop-up, but still proceeds to submit the form as is anyway. How do I fix this?

<form name="TheForm" method="POST" action="process.php" enctype="multipart/form-data">
<table border="0" width="100%" id="table1" cellspacing="1">
	<tr>
		<td width="100" bgcolor="#EAEAEA">
		<font face="Arial" style="font-size: 8pt; font-weight: 700" color="#3B3D61">Name:</font></td>
		<td width="225" bgcolor="#EAEAEA">
<font face="Arial"><span style="font-size: 8pt"><font color="#3B3D61">
<input type="text" name="nm"  size="30" style="color: #3B3D61; font-family: Arial; font-size: 8pt; border: 1px solid #E0E0E0; padding-left: 3px; background-color: #FFFFFF"></font></span></font></td>
		<td bgcolor="#EAEAEA"><STRONG style="FONT-WEIGHT: 400"><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61>So we can greet you personally</FONT></STRONG></td>
	</tr>
	<tr>
		<td width="100">
		<font face="Arial" style="font-size: 8pt; font-weight: 700" color="#3B3D61">
		E-mail:</font></td>
		<td width="225">
<font face="Arial"><span style="font-size: 8pt"><font color="#3B3D61">
<input type="text" name="em"  size="30" style="font-family: Arial; font-size: 8pt; color: #3B3D61; border: 1px solid #E0E0E0; padding-left: 3px; background-color: #FFFFFF"></font></span></font></td>
		<td><strong style="font-weight: 400">
<font face="Arial" style="font-size: 8pt" color="#3B3D61">Required</font></strong></td>
	</tr>
	<tr>
		<td width="100" bgcolor="#EAEAEA">
		<font face="Arial" style="font-size: 8pt; font-weight: 700" color="#3B3D61">
		Confirm Email:</font></td>
		<td width="225" bgcolor="#EAEAEA">
<font face="Arial"><span style="font-size: 8pt"><font color="#3B3D61">
<input type="text" name="emx" size="30" style="font-family: Arial; font-size: 8pt; color: #3B3D61; border: 1px solid #E0E0E0; padding-left: 3px"></font></span></font></td>
		<td bgcolor="#EAEAEA"><strong style="font-weight: 400">
<font face="Arial" style="font-size: 8pt" color="#3B3D61">Validate Email</font></strong></td>
	</tr>
	<tr>
		<td width="100"><STRONG><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61>Phone:</FONT></STRONG></td>
		<td width="225">
<strong><font face="Arial" style="font-size: 8pt" color="#3B3D61">(</font></strong><!--webbot bot="Validation" s-display-name="required" b-value-required="TRUE" i-minimum-length="10" --><INPUT style="BORDER-RIGHT: #e0e0e0 1px solid; PADDING-RIGHT: 4px; BORDER-TOP: #e0e0e0 1px solid; PADDING-LEFT: 4px; FONT-SIZE: 8pt; PADDING-BOTTOM: 1px; BORDER-LEFT: #e0e0e0 1px solid; COLOR: #666666; PADDING-TOP: 1px; BORDER-BOTTOM: #e0e0e0 1px solid; FONT-FAMILY: Arial" size=3 name=Area_Code><strong><font face="Arial" style="font-size: 8pt" color="#3B3D61">)
</font></strong>
		&nbsp;<!--webbot bot="Validation" s-display-name="required" b-value-required="TRUE" i-minimum-length="10" --><INPUT style="BORDER-RIGHT: #e0e0e0 1px solid; PADDING-RIGHT: 4px; BORDER-TOP: #e0e0e0 1px solid; PADDING-LEFT: 4px; FONT-SIZE: 8pt; PADDING-BOTTOM: 1px; BORDER-LEFT: #e0e0e0 1px solid; COLOR: #666666; PADDING-TOP: 1px; BORDER-BOTTOM: #e0e0e0 1px solid; FONT-FAMILY: Arial" size=3 name=Phone_1><strong><font face="Arial" style="font-size: 8pt" color="#3B3D61">-</font></strong><!--webbot bot="Validation" s-display-name="required" b-value-required="TRUE" i-minimum-length="10" --><INPUT style="BORDER-RIGHT: #e0e0e0 1px solid; PADDING-RIGHT: 4px; BORDER-TOP: #e0e0e0 1px solid; PADDING-LEFT: 4px; FONT-SIZE: 8pt; PADDING-BOTTOM: 1px; BORDER-LEFT: #e0e0e0 1px solid; COLOR: #666666; PADDING-TOP: 1px; BORDER-BOTTOM: #e0e0e0 1px solid; FONT-FAMILY: Arial" size=10 name=Phone1></td>
		<td><font face="Arial" style="font-size: 8pt" color="#3B3D61">Call?
		<input type="radio" value="V1" name="Yes_Call">Yes<input type="radio" value="V2" checked name="No_Call">No</font></td>
	</tr>
	<tr>
		<td width="100" bgcolor="#EAEAEA"><strong>
		<font face="Arial" style="font-size: 8pt" color="#3B3D61">Time to Call?</font></strong></td>
		<td width="225" bgcolor="#EAEAEA">
		&nbsp;<!--webbot bot="Validation" s-display-name="required" b-value-required="TRUE" i-minimum-length="10" --><INPUT style="BORDER-RIGHT: #e0e0e0 1px solid; PADDING-RIGHT: 4px; BORDER-TOP: #e0e0e0 1px solid; PADDING-LEFT: 4px; FONT-SIZE: 8pt; PADDING-BOTTOM: 1px; BORDER-LEFT: #e0e0e0 1px solid; COLOR: #666666; PADDING-TOP: 1px; BORDER-BOTTOM: #e0e0e0 1px solid; FONT-FAMILY: Arial" size=30 name=Time_To_Call></td>
		<td bgcolor="#EAEAEA"><STRONG style="FONT-WEIGHT: 400">
		<FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61>Optional</FONT></STRONG></td>
	</tr>
	<tr>
		<td width="100"><STRONG><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61>Processor:</FONT></STRONG></td>
		<td width="225"><SELECT style="BORDER-RIGHT: #3e4067 1px solid; BORDER-TOP: #3e4067 1px solid; FONT-SIZE: 8pt; BORDER-LEFT: #3e4067 1px solid; COLOR: #666666; BORDER-BOTTOM: #3e4067 1px solid; FONT-FAMILY: Arial" size=1 name=Processor> <OPTION>Intel Celeron</OPTION> <OPTION>Intel Pentium IV HT</OPTION> <OPTION>Intel Xeon HT</OPTION> <OPTION>Intel Dual Xeon HT</OPTION> </SELECT></td>
		<td><STRONG style="FONT-WEIGHT: 400"><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61>Hyper Thread = 2 Virtual CPU's</FONT></STRONG></td>
	</tr>
	<tr>
		<td width="100" bgcolor="#EAEAEA"><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61><STRONG>Memory:</STRONG></FONT></td>
		<td width="225" bgcolor="#EAEAEA"><SELECT style="BORDER-RIGHT: #3e4067 1px solid; BORDER-TOP: #3e4067 1px solid; FONT-SIZE: 8pt; BORDER-LEFT: #3e4067 1px solid; COLOR: #666666; BORDER-BOTTOM: #3e4067 1px solid; FONT-FAMILY: Arial" size=1 name=Memory> 
		<option selected>Select</option>
		<OPTION>512MB</OPTION> <OPTION>1GB</OPTION> <OPTION>2GB</OPTION> <OPTION>4GB</OPTION></SELECT></td>
		<td bgcolor="#EAEAEA"><font face="Arial" style="font-size: 8pt" color="#3B3D61">
		Upgradeable</font></td>
	</tr>
	<tr>
		<td width="100"><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61>
		<STRONG>Primary Drive:</STRONG></FONT></td>
		<td width="225">
		<SELECT style="BORDER-RIGHT: #3e4067 1px solid; BORDER-TOP: #3e4067 1px solid; FONT-SIZE: 8pt; BORDER-LEFT: #3e4067 1px solid; COLOR: #666666; BORDER-BOTTOM: #3e4067 1px solid; FONT-FAMILY: Arial" size=1 name=Primary_Drive> 
		<option selected>Select</option>
		<option>160GB SATA</option>
		<option>250GB SATA</option>
		<option>36GB SCSI 10k RPM</option>
		<option>36GB SCSI 15k RPM</option>
		<option>73GB SCSI 10k RPM</option>
		<option>73GB SCSI 15k RPM</option>
		<option>146GB SCSI 10k RPM</option>
		<option>300GB SCSI 10k RPM</option>
		</SELECT></td>
		<td><strong style="font-weight: 400">
		<font face="Arial" style="font-size: 8pt" color="#3B3D61">SCSI = Faster 
		Performance</font></strong></td>
	</tr>
	<tr>
		<td width="100" bgcolor="#EAEAEA"><strong>
		<font face="Arial" style="font-size: 8pt" color="#3B3D61">Secondary</font></strong><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61><STRONG> Drive:</STRONG></FONT></td>
		<td width="225" bgcolor="#EAEAEA">
		<SELECT style="BORDER-RIGHT: #3e4067 1px solid; BORDER-TOP: #3e4067 1px solid; FONT-SIZE: 8pt; BORDER-LEFT: #3e4067 1px solid; COLOR: #666666; BORDER-BOTTOM: #3e4067 1px solid; FONT-FAMILY: Arial" size=1 name=Primary_Drive0> 
		<option selected>Select</option>
		<option>160GB SATA</option>
		<option>250GB SATA</option>
		<option>36GB SCSI 10k RPM</option>
		<option>36GB SCSI 15k RPM</option>
		<option>73GB SCSI 10k RPM</option>
		<option>73GB SCSI 15k RPM</option>
		<option>146GB SCSI 10k RPM</option>
		<option>300GB SCSI 10k RPM</option>
		</SELECT></td>
		<td bgcolor="#EAEAEA"><STRONG style="FONT-WEIGHT: 400">
		<FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61>Required for daily backups</FONT></STRONG></td>
	</tr>
	<tr>
		<td width="100"><STRONG><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61>RAID:</FONT></STRONG></td>
		<td width="225"><SELECT style="BORDER-RIGHT: #3e4067 1px solid; BORDER-TOP: #3e4067 1px solid; FONT-SIZE: 8pt; BORDER-LEFT: #3e4067 1px solid; COLOR: #666666; BORDER-BOTTOM: #3e4067 1px solid; FONT-FAMILY: Arial" size=1 name=RAID> <OPTION selected>None</OPTION> <OPTION>RAID 0</OPTION> <OPTION>RAID 1</OPTION></SELECT></td>
		<td><STRONG style="FONT-WEIGHT: 400"><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61>Requires 2 or more drives</FONT></STRONG></td>
	</tr>
	<tr>
		<td width="100" bgcolor="#EAEAEA"><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61><STRONG>Bandwidth:</STRONG></FONT></td>
		<td width="225" bgcolor="#EAEAEA"><SELECT style="BORDER-RIGHT: #3e4067 1px solid; BORDER-TOP: #3e4067 1px solid; FONT-SIZE: 8pt; BORDER-LEFT: #3e4067 1px solid; COLOR: #666666; BORDER-BOTTOM: #3e4067 1px solid; FONT-FAMILY: Arial" size=1 name=Bandwidth> 
		<option selected>Select</option>
		<OPTION>1,000GB</OPTION> <OPTION>1,500GB</OPTION>
		<option>2,000GB</option>
		<option>3,000GB</option>
		</SELECT></td>
		<td bgcolor="#EAEAEA"><STRONG style="FONT-WEIGHT: 400"><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61>10MBps = 3200GB total in/out</FONT></STRONG></td>
	</tr>
	<tr>
		<td width="100"><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61><STRONG>Firewall:</STRONG></FONT></td>
		<td width="225"><SELECT style="BORDER-RIGHT: #3e4067 1px solid; BORDER-TOP: #3e4067 1px solid; FONT-SIZE: 8pt; BORDER-LEFT: #3e4067 1px solid; COLOR: #666666; BORDER-BOTTOM: #3e4067 1px solid; FONT-FAMILY: Arial" size=1 name=Firewall> <OPTION selected>None</OPTION> <OPTION>Cisco Pix 501e</OPTION>
		<option>Cisco Pix 506e</option>
		<option>Cisco Pix 515e</option>
		</SELECT></td>
		<td><STRONG style="FONT-WEIGHT: 400"><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61>Cisco Pix</FONT></STRONG></td>
	</tr>
	<tr>
		<td width="100" bgcolor="#EAEAEA"><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61><STRONG>Control Panel:</STRONG></FONT></td>
		<td width="225" bgcolor="#EAEAEA"><SELECT style="BORDER-RIGHT: #3e4067 1px solid; BORDER-TOP: #3e4067 1px solid; FONT-SIZE: 8pt; BORDER-LEFT: #3e4067 1px solid; COLOR: #666666; BORDER-BOTTOM: #3e4067 1px solid; FONT-FAMILY: Arial" size=1 name=Control_Panel> <OPTION selected>None</OPTION> <OPTION>cPanel + WHM</OPTION> <OPTION>DirectAdmin</OPTION><OPTION>Plesk</OPTION></SELECT></td>
		<td bgcolor="#EAEAEA"><STRONG style="FONT-WEIGHT: 400"><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61>cPanel recommended choice</FONT></STRONG></td>
	</tr>
	<tr>
		<td width="100"><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61><STRONG>O/S:</STRONG></FONT></td>
		<td width="225"><SELECT style="BORDER-RIGHT: #3e4067 1px solid; BORDER-TOP: #3e4067 1px solid; FONT-SIZE: 8pt; BORDER-LEFT: #3e4067 1px solid; COLOR: #666666; BORDER-BOTTOM: #3e4067 1px solid; FONT-FAMILY: Arial" size=1 name=OS> 
		<option selected>Select</option>
		<OPTION>CentOS</OPTION> <OPTION>Fedora</OPTION> <OPTION>Red Hat Enterprise</OPTION></SELECT></td>
		<td><STRONG style="FONT-WEIGHT: 400"><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61>Linux OS</FONT></STRONG></td>
	</tr>
	<tr>
		<td width="100" bgcolor="#EAEAEA"><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61><STRONG>IP Addresses:</STRONG></FONT></td>
		<td width="225" bgcolor="#EAEAEA"><SELECT style="BORDER-RIGHT: #3e4067 1px solid; BORDER-TOP: #3e4067 1px solid; FONT-SIZE: 8pt; BORDER-LEFT: #3e4067 1px solid; COLOR: #666666; BORDER-BOTTOM: #3e4067 1px solid; FONT-FAMILY: Arial" size=1 name=IP> 
		<option selected>Select</option>
		<OPTION>8</OPTION> <OPTION>16</OPTION> <OPTION>24</OPTION><OPTION>32</OPTION>
		<option>64</option>
		<option>128</option>
		<option>256</option>
		</SELECT></td>
		<td bgcolor="#EAEAEA"><STRONG style="FONT-WEIGHT: 400"><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61>ARIN justification required</FONT></STRONG></td>
	</tr>
	<tr>
		<td width="100"><STRONG><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61>Port:</FONT></STRONG></td>
		<td width="225"><SELECT style="BORDER-RIGHT: #3e4067 1px solid; BORDER-TOP: #3e4067 1px solid; FONT-SIZE: 8pt; BORDER-LEFT: #3e4067 1px solid; COLOR: #666666; BORDER-BOTTOM: #3e4067 1px solid; FONT-FAMILY: Arial" size=1 name=Port> 
		<option selected>Select</option>
		<OPTION>10MBps</OPTION> <OPTION>100MBps</OPTION></SELECT></td>
		<td><STRONG style="FONT-WEIGHT: 400"><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61>100MBps = for high traffic sites</FONT></STRONG></td>
	</tr>
	<tr>
		<td width="100" bgcolor="#EAEAEA"><STRONG><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61>Quantity:</FONT></STRONG></td>
		<td width="225" bgcolor="#EAEAEA"><SELECT style="BORDER-RIGHT: #3e4067 1px solid; BORDER-TOP: #3e4067 1px solid; FONT-SIZE: 8pt; BORDER-LEFT: #3e4067 1px solid; COLOR: #666666; BORDER-BOTTOM: #3e4067 1px solid; FONT-FAMILY: Arial" size=1 name=Quantity> 
		<option selected>Select</option>
		<OPTION>1</OPTION> <OPTION>2</OPTION><OPTION>3</OPTION><OPTION>4</OPTION><OPTION>5</OPTION><OPTION>6</OPTION><OPTION>More than 6</OPTION></SELECT></td>
		<td bgcolor="#EAEAEA"><STRONG style="FONT-WEIGHT: 400"><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61>How many servers?</FONT></STRONG></td>
	</tr>
	<tr>
		<td width="100" valign="top"><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61><STRONG>Message:</STRONG></FONT></td>
		<td width="225" valign="top"><TEXTAREA style="BORDER-RIGHT: #e0e0e0 1px solid; BORDER-TOP: #e0e0e0 1px solid; FONT-SIZE: 8pt; BORDER-LEFT: #e0e0e0 1px solid; COLOR: #666666; BORDER-BOTTOM: #e0e0e0 1px solid; FONT-FAMILY: Arial" name=Usage rows=5 cols=40></TEXTAREA></td>
		<td valign="top"><STRONG style="FONT-WEIGHT: 400"><FONT style="FONT-SIZE: 8pt" face=Arial color=#3b3d61>Give us a brief detail of what you intend to use the server for. This will help assist you.</FONT></STRONG></td>
	</tr>
</table>
<p align="center">
<input type="submit" value="Submit" name="SB" onClick="sendOff();" style="color: #3B3D61; font-family: Arial; font-size: 8pt; border: 1px solid #E0E0E0; padding: 2px; background-color: #FFFFFF">

<script language="JavaScript1.2">

// (C) 2000 www.CodeLifter.com
// http://www.codelifter.com
// Free for all users, but leave in this  header

var good;
function checkEmailAddress(field) {

// Note: The next expression must be all on one line...
//       allow no spaces, linefeeds, or carriage returns!
var goodEmail = field.value.match(/\b(^(\S+@).+((\.com)|(\.net)|(\.edu)|(\.mil)|(\.gov)|(\.org)|(\..{2,2}))$)\b/gi);

if (goodEmail){
   good = true
} else {
   alert('Please enter a valid e-mail address.')
   field.focus()
   field.select()
   good = false
   }
}

function sendOff(){
   nmcheck = document.TheForm.nm.value    
   if (nmcheck.length <1) {
      alert('Please enter your name.')
      return
   }         
   good = false
   checkEmailAddress(document.TheForm.em)
   if ((document.TheForm.em.value ==
        document.TheForm.emx.value)&&(good)){
      // This is where you put your action
      // if name and email addresses are good.
      // We show an alert box, here; but you can
      // use a window.location= 'http://address'
      // to call a subsequent html page, 
      // or a Perl script, etc.
      alert("Name and email address fields verified good.")
   }     
   if ((document.TheForm.em.value !=
          document.TheForm.emx.value)&&(good)){
          alert('Both e-mail address entries must match.')
   }
}
</script>
</form>

PS: anyone know of any simple javascript (not applet) that I can use to provide a realtime instant quote in this form? Any help would be appreciated. I've searched endlessly on about 5 or so script sites and couldn't find something decent/simple.

javascript

2 Contributors
1 Reply
122 Views
1 Week Discussion Span
Latest Post 19 Years Ago Latest Post by jpn311

Reply to this topic

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.

jpn311 0 Newbie Poster · Answer 1 · 2005-04-26T21:37:16+00:00

The form is submitting because you are using an input type of "Submit". Change this to "button", then in the Javascript function use document.TheForm.submit() when all fields are properly validated.

As for your instant quote, I'm assuming you are wanting to pull data from a database. If so, you will need to use xmlhttp to send an HTTP request to a server side script to do the processing.