js validation does not work in Netscape but does in IE??

shdwdrgn000 · Aug 12, 2004

I have fallen into a situation with a form on our website. The form functions perfectly in IE, but the same exact page does not work in Netscape. The validation refuses to work on the radio buttons at the bottom of the form. Below I have attached exerpts from the js code, and the html form code. The validation gets caught in the radio buttons, it will not let you pass, if it you click any of the buttons at all, or leave it empty. The js script is called in the <head> of the document with the line of code
<SCRIPT LANGUAGE="javascript" SRC="scripts/usbuildings_new.js"></SCRIPT>

Any help you can give me would be great.

----js code (exerpt)------------

// Publication validation
//
if (the_form.has_value.value == '0')
{
alert('Please select how you heard about us');
return (false);
}

if (document.all.publication_1.checked)
{
if (the_form.adv_magazine.value == '') {
alert('Please enter the name of the magazine.');
return(false);
}
}
else if (document.all.publication_2.checked)
{
if (the_form.adv_promotional.value == '') {
alert('Please enter your special promotion code listed in the middle or bottom right hand side of your ad.');
return(false);
}
}

return (true);
}

//
// Publication type events
//

function publication_event()
{
if (document.all.publication_1.checked)
{
document.all.adv_1.style.visibility = 'visible';
document.all.adv_2.style.visibility = 'hidden';
document.all.adv_magazine.focus();
}
else if (document.all.publication_2.checked)
{
document.all.adv_1.style.visibility = 'hidden';
document.all.adv_2.style.visibility = 'visible';
document.all.adv_promotional.focus();
}
else
{
document.all.adv_1.style.visibility = 'hidden';
document.all.adv_2.style.visibility = 'hidden';
}
document.all.has_value.value = '1';
}

----HTML Form Code (excerpt)--------------

<tr class='formrow'>
<td class='tdformtextreq' colspan="5">
*HOW DID YOU HEAR ABOUT US?
</td>
</tr>
<tr>
<td colspan="5">
<input type="hidden" id="has_value" value="0"/>
</td>
</tr>
<tr class='formrow'>
<td align="right" colspan="2">
<div id="adv_1" style="visibility: Hidden">
<strong>Magazine Name :</strong>
<input type="text" size="25" style="width: 200px" name="publication_descrip" id="adv_magazine"/>
</div>
</td>
<td colspan="3">
<INPUT TYPE="radio" VALUE="1" NAME="publication_id" ID="publication_1" onclick="publication_event();">
<strong>Magazine Ad</strong>
</td>
</tr>
<tr class='formrow'>
<td align="right" colspan="2">
<div id="adv_2" style="visibility: hidden">
<strong>Enter code for special savings:</strong>
<input type="text" size="25" style="width: 200px" name="publication_descrip" id="adv_promotional"/>
</div>
</td>
<td colspan="3">
<INPUT TYPE="radio" VALUE="2" NAME="publication_id" ID="publication_2" onclick="publication_event();">
<strong>Promotional Ad</strong>
</td>
</tr>
<tr class='formrow'>
<td colspan="2"> </td>
<td colspan="3">
<INPUT TYPE="radio" VALUE="3" NAME="publication_id" ID="publication3" onclick="publication_event();">
<strong>TV Commercial</strong>
</td>
</tr>
<tr class='formrow'>
<td colspan="2"> </td>
<td colspan="3">
<INPUT TYPE="radio" VALUE="4" NAME="publication_id" ID="publication4" onclick="publication_event();">
<strong>Search Engine</strong>
</td>
</tr>
<tr class='formrow'>
<td colspan="2"> </td>
<td colspan="3">
<INPUT TYPE="radio" VALUE="5" NAME="publication_id" ID="publication5" onclick="publication_event();">
<strong>Banner Ad</strong>
</td>
</tr>
<tr class='formrow'>
<td colspan="2"> </td>
<td colspan="3">
<INPUT TYPE="radio" VALUE="6" NAME="publication_id" ID="publication6" onclick="publication_event();">
<strong>Friend or Relative</strong>
</td>
</tr><tr class='formrow'>
<td colspan="5" align=center>
<br><br>
Would You Like To
</td>
</tr>
<tr class='formrow'>
<td colspan="5" align="center">
<select name="contact_status" id="contact_status" >
<OPTION VALUE="download" selected>Download Brochure</OPTION>
<OPTION VALUE="mail">Have Brochure Mailed</OPTION> </select>
</td>
</tr>
<tr class='formrow'>
<td colspan="5"> </td>
</tr>
<tr class='formrow'>
<td colspan="5" align="center">
<input class="forminput" type="submit" value="Please Submit" size="25" style="width: 150px"/>
<INPUT class="forminput" TYPE="reset" VALUE="Cancel" NAME="reset">
</td>
</tr>
</table>
</form>

vbkris · Aug 12, 2004

what version of NS are u talking about???

Known is handfull, Unknown is worldfull

shdwdrgn000 · Aug 12, 2004

The IE 6.0 and Netscape 7.1 are the browsers in question.

BillyRayPreachersSon · Aug 12, 2004

I don't believe "document.all" works in NS.

You should refer to your form elements using:

Code:

document.forms[0].elements['elementName']

or

Code:

document.forms['formName'].elements['elementName']

Hope this helps,
Dan

tviman · Aug 12, 2004

Dan is correct - document.all is an IE only directive.

There's always a better way. The fun is trying to find it!

vongrunt · Aug 12, 2004

... and I'm pretty sure "the_form" stuff won't work outside IE.

tviman · Aug 12, 2004

and I'm pretty sure "the_form" stuff won't work outside IE.

I agree, but without seeing all of the JS or HTML code, it's hard to say. He may be passing the form name to the validation function inwhich case "the_form" may be OK.

There's always a better way. The fun is trying to find it!

AtomicChip · Aug 12, 2004

Instead of referencing these objects explicitly (document.forms[0].elements['elementName']), why not use document.getElementById('elementName')? I do believe that it's cross-browser compatible.

-----------------------------------------------

http://www.liquidfuzion.com

"The night sky over the planet Krikkit is the least interesting sight in the entire universe."
-Hitch Hiker's Guide To The Galaxy

BillyRayPreachersSon · Aug 12, 2004

If "document.getElementById('elementName')" is not referencing an element explicitly, I don't know what is!

That aside, the form method is more widely compatible - NN4, for example, doesn't support getElementById.

Dan

shdwdrgn000 · Aug 12, 2004

I tried using your initial suggestions, and still no change. I tried the code like this:

//
// Publication validation
//
if (document.forms[0].has_value.value == '0')
{
alert('Please select how you heard about us');
return (false);
}

if (document.forms[0].publication_1.checked)
{
if (the_form.adv_magazine.value == '') {
alert('Please enter the name of the magazine.');
return(false);
}
}
else if (document.forms[0].publication_2.checked)
{
if (the_form.adv_promotional.value == '') {
alert('Please enter your special promotion code listed in the middle or bottom right hand side of your ad.');
return(false);
}
}

return (true);
}

//
// Publication type events
//

function publication_event()
{
if (document.forms[0].publication_1.checked)
{
document.forms[0].adv_1.style.visibility = 'visible';
document.forms[0].adv_2.style.visibility = 'hidden';
document.forms[0].adv_magazine.focus();
}
else if (document.forms[0].publication_2.checked)
{
document.forms[0].adv_1.style.visibility = 'hidden';
document.forms[0].adv_2.style.visibility = 'visible';
document.forms[0].adv_promotional.focus();
}
else
{
document.forms[0].adv_1.style.visibility = 'hidden';
document.forms[0].adv_2.style.visibility = 'hidden';
}
document.forms[0].has_value.value = '1';
}

and the behaved the same way with the same problem. I an not sure if I am chaning the code improperly or what, but any other ideas would be a great help.

tviman · Aug 12, 2004

As you can see, you're getting a lot of "guesses" and "shots in the dark". To get the best help, you should post a link to the page(s) or post all the code.

There's always a better way. The fun is trying to find it!

BillyRayPreachersSon · Aug 12, 2004

"document.forms[0]" will only work if your form is the first form on the page.

If it is not, you should change the "0" to the number of your form -1.

But as tviman says, the complete code (or better still, a URL to it) would be benficial.

Hope this helps,
Dan

shdwdrgn000 · Aug 17, 2004

I am at my wicks end here, I have tried all your suggestions and none of them seem to fix the problem, so as requested, here are the URLs.

The Form:

http://www.usbuildingsdirect.com/brochure.asp

and The .js File

http://www.usbuildingsdirect.com/scripts/usbuildings_new.js

I hope this is what you are looking for. Thank you for all your help again.

vongrunt · Aug 17, 2004

I opened .js file, did mass replace of document.all.blah into document.getElementById("blah") and validation worked OK.

tviman · Aug 17, 2004

Change these:

Code:

if (document.all.publication_1.checked)
	{
		if (the_form.adv_magazine.value == '') {
			alert('Please enter the name of the magazine.');
			return(false);
		}
	}
	else if (document.all.publication_2.checked)

to these:

Code:

if (the_form.publication_id[0].checked == true)
	{
		if (the_form.adv_magazine.value == '') {
			alert('Please enter the name of the magazine.');
			return(false);
		}
	}
	else if (the_form.publication_id[1].checked == true)

There's always a better way. The fun is trying to find it!

AtomicChip · Aug 17, 2004

Ok, the length of this thread is getting kinda silly...

First -

Using document.getElementById('elementName') in NS6+
(note: this won't work for version < NS6):

http://www.mozilla.org/docs/dom/domref/dom_doc_ref48.html

Using document.getElementById('elementName') in IE:

http://msdn.microsoft.com/library/d...or/dhtml/reference/methods/getelementbyid.asp

document.getElementById is also supported by Opera:

http://www.opera.com/docs/specs/opera6/js/dom-core.dml

So, unless you're writing a page to support older browsers (non-DOM2 compliant), document.getElementById('elementName') should be all that you need for this problem.

Second -

BillyRay, accessing an element by document.form.element would be referencing an object explicitly as you're "explicitly" referencing it by it's full name (working down the DOM) - you know what object type it is...

Accessing an element by document.getElementById('element') would not be referencing something explicitly as the client works to find that object - the type is unknown until the object is accessed.

Make sense (working on my first coffee, so I hope that makes sense)?

-----------------------------------------------

http://www.liquidfuzion.com

"The night sky over the planet Krikkit is the least interesting sight in the entire universe."
-Hitch Hiker's Guide To The Galaxy

BillyRayPreachersSon · Aug 18, 2004

I guess we'll just have to differ over our opinions of the term "explicitly", then. As far as I am concerned, both are referencing [the element] explicitly, as both are directing the DOM to something with an explicit name or position within the DOM.

In this case, I'd say the best course of action would be not to use getElementById, instead giving everything names instead of IDs, and then using the correct form notation. Purely for the reason that at the moment, this syntax will cover more browsers that the getElemenyById syntax.

Just my thoughts, of course - shdwdrgn000 is free to use whatever syntax they deem best for their project, given all the information - which I think we've all contributed a nice amount of.

Now I need my first coffee of the day, too ;o)

Dan

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!

js validation does not work in Netscape but does in IE??

shdwdrgn000

MIS

vbkris

Programmer

shdwdrgn000

MIS

BillyRayPreachersSon

Programmer

tviman

Programmer

vongrunt

Programmer

tviman

Programmer

AtomicChip

Programmer

BillyRayPreachersSon

Programmer

shdwdrgn000

MIS

tviman

Programmer

BillyRayPreachersSon

Programmer

shdwdrgn000

MIS

vongrunt

Programmer

tviman

Programmer

AtomicChip

Programmer

BillyRayPreachersSon

Programmer

Similar threads

Part and Inventory Search

Sponsor