this code works in IE but not Firefox - please help

[Notgiven]

Both of the following code smippets work in IE but not in Firefox. The
javascript error for both scripts below is "x has not properties".

The select boxes are shown as arrays since they are generated by Pear's
Quickform - no way around it - I tried.

This code in the html calls the function above and should copy the value
selected in a pull-down list to another field:

<script type="text/javascript">
var x=document.getElementById('fld[2]');
</script>
<script type="text/javascript">function addOption(){

myList = document.getElementById('lfld');
document.forms[0].elements['lfld'].value =
document.forms[0].elements['lfld'].value + x.options[x.selectedIndex].text +
'\n';
}
</script>
<input onclick="addOption()" name="ibutTest" value="Click here to ADD
selected value" type="button" />

The following code should open a new window sending it a parameter to open:
'onClick' => "window.open('page1.php?i=' +
x.options[x.selectedIndex].value,'Name','toolbar=no, menubar=no,
scrollbars=yes, width=600, height=400, top=100, left=100')"
Many many thanks for your help!

[Randy Webb]

Notgiven said the following on 1/10/2006 5:06 PM:

Both of the following code smippets work in IE but not in Firefox. The
javascript error for both scripts below is "x has not properties".

The select boxes are shown as arrays since they are generated by Pear's
Quickform - no way around it - I tried.

This code in the html calls the function above and should copy the value
selected in a pull-down list to another field:

<script type="text/javascript">
var x=document.getElementById('fld[2]');
Why are you using gEBI to access a form element? Use the forms
collection. From what you indicate, fld[2] is the name of the select,
not its ID:

var x = document.forms['formNAMEnotID'].elements['elementNAMEnotID'];
</script>
<script type="text/javascript">function addOption(){

myList = document.getElementById('lfld');
document.forms[0].elements['lfld'].value =
document.forms[0].elements['lfld'].value + x.options[x.selectedIndex].text +
'\n';
}
</script>
<input onclick="addOption()" name="ibutTest" value="Click here to ADD
selected value" type="button" />

The following code should open a new window sending it a parameter to open:
'onClick' => "window.open('page1.php?i=' +
x.options[x.selectedIndex].value,'Name','toolbar=no, menubar=no,
scrollbars=yes, width=600, height=400, top=100, left=100')"

See above with regards to 'x'. Also, the third parameter to window.open
does not allow spaces, remove them.

--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/

[Gérard Talbot]

Notgiven wrote :

Both of the following code smippets work in IE but not in Firefox. The
javascript error for both scripts below is "x has not properties".

The select boxes are shown as arrays since they are generated by Pear's
Quickform - no way around it - I tried.

This code in the html calls the function above and should copy the value
selected in a pull-down list to another field:

<script type="text/javascript">
var x=document.getElementById('fld[2]');
Where is this script located in relation to the body node, in relation
to that fld[2] object/node? Before or after the select?
Providing an url showing the problem, allowing people reading your post
to test your webpage is always better.

MSIE 6 does NOT support the add method as described by DOM 2 HTML interface:
http://www.w3.org/TR/DOM-Level-2-HTM...ml#ID-14493106
http://www.gtalbot.org/BrowserBugsSe...ptionNull.html

Firefox and Mozilla-based browsers do support the add method as
described by DOM 2 HTML.
</script>
<script type="text/javascript">function addOption(){

myList = document.getElementById('lfld');
document.forms[0].elements['lfld'].value =
document.forms[0].elements['lfld'].value + x.options[x.selectedIndex].text +
'\n';
}
</script>
<input onclick="addOption()" name="ibutTest" value="Click here to ADD
selected value" type="button" />
Is your webpage XHTML-based or HTML ?

The following code should open a new window sending it a parameter to open:
'onClick' => "window.open('page1.php?i=' +
x.options[x.selectedIndex].value,'Name','toolbar=no, menubar=no,
scrollbars=yes, width=600, height=400, top=100, left=100')"

The 3rd parameter of your window.open call is not written as best:
1- there should be no blank space between window features
http://developer.mozilla.org/en/docs...and_parameters
2- there is no need to list window features which are turn off
3- there is a necessary need to list the ones which are turn on:
resizable is not listed, therefore, you implicitly (or without knowing
it) want/demand the window to be non-resizable .. which is
anti-accessibility
4- the code makes the window for one usage only; it won't be reusable,
recyclable either because the script does not manage the returned object
reference. Again this is not recommendable.

DOM:window.open
http://developer.mozilla.org/en/docs/DOM:window.open

Gérard
--
remove blah to email me

[Lasse Reichstein Nielsen]

"Notgiven" <no*********@invalid.invalid> writes:

Both of the following code smippets work in IE but not in Firefox. The
javascript error for both scripts below is "x has not properties". .... <script type="text/javascript">
var x=document.getElementById('fld[2]');
Even if there is an element with id="fld[2]", that is not a valid value
for the id attribute. My guess is that this is why Firefox won't find
it - it has already been "error corrected" away.

If it is a select element inside a form, then you can use:
var x = document.forms['idOfForm'].elements['fld[2]'];
to find it. If it is not inside a form, you can try using "fld[2]" as
the name property, not id, and use:
var x = document.getElementsByName('fld[2]')[0];

.... The following code should open a new window sending it a parameter to open:
'onClick' => "window.open('page1.php?i=' +
x.options[x.selectedIndex].value,'Name','toolbar=no, menubar=no,
scrollbars=yes, width=600, height=400, top=100, left=100')"

You should avoid spaces in the format string for window.open. Some
browsers consider it an error and fails.

/L
--
Lasse Reichstein Nielsen - lr*@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'

[Jonas Raoni]

Notgiven escreveu:

Both of the following code smippets work in IE but not in Firefox. The
javascript error for both scripts below is "x has not properties".
var x=document.getElementById('fld[2]');

Please, don't tell me that you're doing something like this:

<input type="text" name="teletubbie" />

<script type="text/javascript>
alert(document.getElementById("teletubbie").name);
</script>

If you're doing this, do one of the following:

- use document.forms.YourForm["fld[2]"]...
- add the id property (name="teletubbie" id="teletubbie")
- or change the document.getElementById for document.getElementsByName

I preffer the first one ;]
--
Jonas Raoni Soares Silva
http://www.jsfromhell.com

[Notgiven]

Fixed it guys - thanks very very much!

Here's what I changed:

var x = document.forms['formNAMEnotID'].elements['elementNAMEnotID'];

This worked immediately - well almost immediately when I figured out the
correct way to write.

I used the Web Developer 1.0 add-on to Firefox - it was immensely helpful

Thanks again!