this code works in IE but not Firefox - please help

N

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!
 
R

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.
 
G

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-HTML/html.html#ID-14493106
http://www.gtalbot.org/BrowserBugsSection/MSIE6Bugs/SelectAddOptionNull.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/DOM:window.open#Return_value_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
 
L

Lasse Reichstein Nielsen

Notgiven said:
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
 
J

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 ;]
 
N

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!
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,744
Messages
2,569,483
Members
44,903
Latest member
orderPeak8CBDGummies

Latest Threads

Top