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 Chris Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

JavaScript Validate Working in IE but not FF

Status
Not open for further replies.

pirigyi

Technical User
Apr 26, 2001
11
US
Hi,

My script seems to be working just fine in IE, but not in firefox. Any suggestions on how to fix? I stripped a lot of the HTML, but I copied in the JS script from the header and the form info.

Any help would be appreciated.

Thanks,
Mike


<body>

<SCRIPT LANGUAGE="JavaScript">

function checkFields() {

missinginfo = "";

if (document.theForm.Reason_Contact.value == "0") {

missinginfo += "\n - Reason For Contact";

}

if (document.theForm.realname.value == "") {

missinginfo += "\n - Name";

}

if (document.theForm.Address.value == "") {

missinginfo += "\n - Address";

}

if (document.theForm.City.value == "") {

missinginfo += "\n - Town / City";

}

if (document.theForm.State.value == "0") {

missinginfo += "\n - State or Province";

}

if (document.theForm.Postal_Code.value == "") {

missinginfo += "\n - Zip / Postal Code";

}

if (document.theForm.Country.value == "0") {

missinginfo += "\n - Country";

}

if ((document.theForm.email.value == "") ||

(document.theForm.email.value.indexOf('@') == -1) ||

(document.theForm.email.value.indexOf('.') == -1)) {

missinginfo += "\n - Email address";

}

if (!(theForm.Contact_Preference[0].checked ||

theForm.Contact_Preference[1].checked ||

theForm.Contact_Preference[2].checked ||

theForm.Contact_Preference[3].checked)) {

missinginfo += "\n - Contact Preference";

}



if (missinginfo != "") {

missinginfo ="_____________________________\n" +

"You failed to correctly fill in your:\n" +

missinginfo + "\n_____________________________" +

"\nPlease re-enter and submit again!";

alert(missinginfo);

return false;

}

else return true;

}


// End -->

</script>

<!-- End Verify Fields //-->


<form name="theForm" method="post" action="cgi-bin/formmail/FormMail.pl" onSubmit="return checkFields();">

<input type="hidden" name="recipient" value="XXX">

<input type="hidden" name="subject" value="Online Assistance">



<input type="hidden" name="redirect" value="


<table width="95%" border="0">

<tr>

<td width="54%" CLASS="Text1"><font color="#FF0000">*</font> <b>Reason

for Contact:</b></td>

<td width="46%">&nbsp;</td>

</tr>

<tr>

<td width="54%" height="8" CLASS="Text1"> <select name="Reason_Contact" id="select3" class="S3" width="235px">

<option value="0" selected>Click Here to Select</option>

<option value="Request Free Literature">Request Free Literature</option>

<option value="Have a Representative Contact Me">Have a

Representative Contact Me</option>

<option value="Have a Technician Contact Me">Have a Technician Contact Me</option>

<option value="Web Site Related Inquiry">Web Site Related Inquiry</option>

<option value="Presale Inquiry">Presale Inquiry</option>

<option value="Post Sale Inquiry">Post Sale Inquiry</option>

<option value="General Inquiry">General Inquiry</option>

</select> <br> <br> </td>

<td width="46%" height="8">&nbsp;</td>

</tr>

<tr>

<td width="54%" CLASS="Text1"><font color="#FF0000">*</font><b> Full

Name:</b></td>

<td width="46%">&nbsp;</td>

</tr>

<tr>

<td width="54%" height="20" CLASS="Text1"> <input type="text" name="realname" size="33" maxlength="200">

<br> <br> </td>

<td width="46%" height="20">&nbsp;</td>

</tr>

<tr>

<td width="54%" CLASS="Text1"><b>Company:</b></td>

<td width="46%">&nbsp;</td>

</tr>

<tr>

<td width="54%" height="17" CLASS="Text1"> <input type="text" name="Company" size="33" maxlength="200">

<br> <br> </td>

<td width="46%" height="17">&nbsp;</td>

</tr>

<tr>

<td width="54%" CLASS="Text1"><b>Title:</b></td>

<td width="46%">&nbsp;</td>

</tr>

<tr>

<td width="54%" height="17" CLASS="Text1"> <input type="text" name="Title" size="33" maxlength="200">

<br> <br> </td>

<td width="46%" height="17">&nbsp;</td>

</tr>

<tr>

<td width="54%" class="Text1"><font color="#FF0000">*</font> <b>Address:</b></td>

<td width="46%">&nbsp;</td>

</tr>

<tr>

<td width="54%" class="Text1"> <input type="text" name="Address" size="33" maxlength="200">

<br> </td>

<td width="46%">&nbsp;</td>

</tr>

<tr>

<td width="54%" class="Text1"> <input type="text" name="Address2" size="33" maxlength="200">

<br> <br> </td>

<td width="46%">&nbsp;</td>

</tr>

<tr>

<td CLASS="Text1"><font color="#FF0000">* </font><b>Town/City:</b></td>

<td>&nbsp;</td>

</tr>

<tr>

<td height="17" CLASS="Text1"> <input type="text" name="City" size="33" maxlength="200">

<br> <br> </td>

<td height="17">&nbsp;</td>

</tr>

<tr>

<td width="54%" CLASS="Text1"><font color="#FF0000">*</font> <b>State

or Province:</b></td>

<td width="46%">&nbsp;</td>

</tr>

<tr>

<td width="54%" height="17" CLASS="Text1"> <select name="State" id="select51">
<OPTION selected value="0" >Select State or Province
<OPTION value="0" >---USA---
<OPTION value="Alabama" >Alabama
<OPTION value="Alaska" >Alaska
</select> <br> <br> </td>

<td width="46%" height="17">&nbsp;</td>

</tr>

<tr>

<td width="54%" CLASS="Text1"><font color="#FF0000">* </font><b>Zip

/ Postal Code:</b></td>

<td width="46%">&nbsp;</td>

</tr>

<tr>

<td width="54%" height="17" CLASS="Text1"> <input type="text" name="Postal_Code" size="15" maxlength="15">

<br> <br> </td>

<td width="46%" height="17">&nbsp;</td>

</tr>

<tr>

<td width="54%" CLASS="Text1"><font color="#FF0000">*</font><b> Country:</b></td>

<td width="46%">&nbsp;</td>

</tr>

<tr>

<td width="54%" height="17" CLASS="Text1"> <select name="Country" id="select52">
<option value="0" selected>Choose Country </option>
<option value="United States">United States </option>
<option value="Canada">Canada </option>
</select> <br> <br> </td>

<td width="46%" height="17">&nbsp;</td>

</tr>

<tr>

<td width="54%" CLASS="Text1"><b>Phone:</b></td>

<td width="46%">&nbsp;</td>

</tr>

<tr>

<td width="54%" height="13" CLASS="Text1"> <input type="text" name="Phone" size="20" maxlength="20">

<br> <br> </td>

<td width="46%" height="13">&nbsp;</td>

</tr>

<tr>

<td width="54%" CLASS="Text1"><b>Fax:</b></td>

<td width="46%">&nbsp;</td>

</tr>

<tr>

<td width="54%" height="10" CLASS="Text1"> <input type="text" name="Fax" size="20" maxlength="20">

<br> <br> </td>

<td width="46%" height="10">&nbsp;</td>

</tr>

<tr>

<td width="54%" CLASS="Text1"><font color="#FF0000">*</font><b> Email:</b></td>

<td width="46%">&nbsp;</td>

</tr>

<tr>

<td width="54%" height="6" CLASS="Text1"> <input type="text" name="email" size="33" maxlength="200">

<br> <br> </td>

<td width="46%" height="6">&nbsp;</td>

</tr>

<tr>

<td width="54%" CLASS="Text1"><b><font color="#FF0000">* </font><b></b>Contact

Preference:</b></td>

<td width="46%">&nbsp;</td>

</tr>

<tr>

<td width="54%" height="65" CLASS="Text1"> <input type="radio" name="Contact_Preference" value="Email">

&nbsp;Email <br> <input type="radio" name="Contact_Preference" value="Fax">

&nbsp;Fax <br> <input type="radio" name="Contact_Preference" value="Phone">

&nbsp;Phone <br> <input type="radio" name="Contact_Preference" value="Do not contact">

&nbsp;Please do not contact me<br> <br> </td>

<td width="46%" height="65">&nbsp;</td>

</tr>

<tr>

<td colspan="2" CLASS="Text1"><b>Product Line:</b><br>

Please choose one or more products from the list below.</td>

</tr>

<tr>

<td width="54%" CLASS="Text1" height="15"> <input type="checkbox" name="Product_Selections" value="Compactstar">

Compactstar</td>

<td width="46%" class="Text1" height="15"> <input type="checkbox" name="Product_Selections" value="Portastar">

Portastar</td>

</tr>

<tr>

<td width="54%" CLASS="Text1"> <input type="checkbox" name="Product_Selections" value="Starlet">

Starlet</td>

<td width="46%" class="Text1"> <input type="checkbox" name="Product_Selections" value="SN50">

SN50</td>

</tr>

<tr>

<td width="54%" CLASS="Text1"> <input type="checkbox" name="Product_Selections" value="Turbostar">

Turbostar</td>

<td width="46%" class="Text1"> <input type="checkbox" name="Product_Selections" value="SN81">

SN81</td>

</tr>

<tr>

<td width="54%" CLASS="Text1"> <input type="checkbox" name="Product_Selections" value="Twinstar">

Twinstar</td>

<td width="46%" class="Text1"> <input type="checkbox" name="Product_Selections" value="SN101">

SN101</td>

</tr>

<tr>

<td width="54%" CLASS="Text1" height="9"> <input type="checkbox" name="Product_Selections" value="Mobilstar">

Mobilstar</td>

<td width="46%" height="9" class="Text1"> <input type="checkbox" name="Product_Selections" value="Not Sure">

I'm not really sure...</td>

</tr>

<tr>

<td width="54%" CLASS="Text1" height="3"><br> </td>

<td width="46%" height="2" class="Text1">&nbsp;</td>

</tr>

<tr>

<td width="54%" CLASS="Text1"><b>Comments / Special Instructions:</b></td>

<td width="46%">&nbsp;</td>

</tr>

<tr>

<td width="54%" CLASS="Text1"> <textarea cols="40" rows="8" name="Comments"></textarea>

<br> <br> </td>

<td width="46%">&nbsp;</td>

</tr>

<tr>

<td width="54%">&nbsp;</td>

<td width="46%">&nbsp;</td>

</tr>

<tr>

<td width="54%"> <a href="javascript:Validate()"><input type="submit" name="Submit" value="Submit"></a>&nbsp;&nbsp; <input type="reset" name="Reset" value="Reset">

<input type="hidden" name="required" value="email"> <input type="hidden" name="env_report" value="HTTP_USER_AGENT,HTTP_REFERER">

<input type="hidden" name="print_config" value="realname,email">

<input type="hidden" name="sort" value="order:env_report,realname,Reason_Contact,Company,Title,Address,Address2,City,State,Postal_Code,Country,Phone,Fax,email,Contact_Preference,Product_Selections,Comments">


</body>

</html>
 
You need to reference your form data differently.

You have:
Code:
document.theForm.realname.value

That is not standard compliant and FF doesn't recognize that syntax. Instead do this:

Code:
document.forms["theForm"].elements["realname"].value

Syntax is document.forms["formName"].elements["elementName"].value


You can do that, or you can put id tags on each element and reference the element's value like this:

Code:
document.getElementById("elementId").value

I prefer the second method, but either way is acceptable.

<.

 
Thanks for the info.

I wasn't using the document. reference here (w/ radio buttons) and there's a [#] included with the element name. What would be the proper syntax here?


if (!(theForm.Contact_Preference[0].checked ||

theForm.Contact_Preference[1].checked ||

theForm.Contact_Preference[2].checked ||

theForm.Contact_Preference[3].checked)) {

missinginfo += "\n - Contact Preference";

}


Also, I have made the changes but there seems to be a FF issue with the Submit button. It actually has what appears to be a hyperlink on the word Submit. I click it and it does nothing. In IE works fine. I guess I'm not calling the function properly?

Thanks,
Mike
 
I see you have an anchor tag around the submit button:

Code:
[!]<a href="javascript:Validate()">[/!]<input type="submit" name="Submit" value="Submit">[!]</a>[/!]
That anchor tag is calling a javascript function that doesn't even exist. Erase that anchor tag entirely.

Code:
<input type="submit" name="Submit" value="Submit">


And this is how you would reference the radio buttons:

Code:
document.forms["theForm"].elements["Contact_Preference"][2].checked

<.

 
Doh!! That was a real bonehead thing to do! Thanks for your help!

-Mike
 
If you're going to use a validation function to return true or false, you should put it in the onsubmit event handler in the form tag:

<form name="formname" onsubmit="return Validate();">

But, like monksnake said, the function doesn't exist in the code you've provided.

Lee
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top