getElementById problem on IE

[jaapkramer]

I have this function which changes the image according to a selection
which is made by a select box.

This is all working great with Firefox and on a Mac. But it refuses to
work in IE. In IE it will change the source, but the image isn't
replaced (still get it?)
So i change the source to order1.gif, but order0.gif is still
displayed.

<select name=\"prior22345\" class=\"noprint\"
onChange=\"javascript:changePrior(22345)\" id=\"22345\">
<option value=\"0\">0</option>
<option value=\"1\">1</option>
<option value=\"2\">2</option>
<option value=\"3\">3</option>
<option value=\"4\">4</option>
<option value=\"5\">5</option>
<option value=\"6\">6</option>
<option value=\"7\">7</option>
<option value=\"8\">8</option>
</select>

this is the image i'm changing:

<img src='images/icons/order0.gif' id='prior22345'>

the function i'm executing:

function changePrior( waid )
{
prioriteit = document.getElementById( waid ).value;
document.getElementById('prior'+ waid).src = 'images/icons/order' +
prioriteit + '.gif';
checker();
}
\

[jaapkramer]

I probably found the problem.
I have a form around the image and select box. If i remove it the
function is working great.

But i can't remove the form tags because other functions will stop
working instead. Is theire a way around my problem?

[Duncan Booth]

wrote:

I probably found the problem.
I have a form around the image and select box. If i remove it the
function is working great.

But i can't remove the form tags because other functions will stop
working instead. Is theire a way around my problem?

Your select tag has a 'name' attribute which is the same as the img tag's
'id'. IE pollutes the 'id' namespace with the 'name' attributes from form
controls, so I guess you are picking up the select tag instead of the
image. Change the id on the image and it should work fine.

[jaapkramer]

You are right, stupid that i didn't noticed that. Ohwell, most faults
are stupid ones.

Thank You for helping me out.

[Duncan Booth]

wrote:

You are right, stupid that i didn't noticed that. Ohwell, most faults
are stupid ones.
It is always easier to spot that kind of mistake when you are trying to
figure out what the code does than when you think you already know what it
does.

Have you heard of the 'cardboard programmer' technique? Get a life-size
cardboard cut-out of another programmer (a stuffed toy, pot plant, or in
emergencies a live human with no programming abilities will do equally
well), and explain to it in great detail exactly why it is your code can't
possibly be failing. Almost invariably part way through the explanation
you'll find the answer.

Thank You for helping me out.

Glad to help.

[Grant Wagner]

--
Grant Wagner <gw*****@agricoreunited.com>
comp.lang.javascript FAQ - http://jibbering.com/faq
"Duncan Booth" <du**********@invalid.invalid> wrote in message
news:Xn*************************@127.0.0.1...

wrote:

Have you heard of the 'cardboard programmer' technique? Get a
life-size
cardboard cut-out of another programmer (a stuffed toy, pot plant, or
in
emergencies a live human with no programming abilities will do equally
well), and explain to it in great detail exactly why it is your code
can't
possibly be failing. Almost invariably part way through the
explanation
you'll find the answer.

Variations on a theme:

http://www.sellsbrothers.com/spout/d....htm#teddybear

"According to legend, the TA office next to the Stanford computer
science lab is guarded by a teddy bear. Before a student is allowed to
consume valuable time asking a question of the TA, they must first
explain it to the teddy bear. Apparently the bear is able to answer 80%
of the questions that students ask, saving time for the TAs to play
Unreal Tournament."

--
Grant Wagner <gw*****@agricoreunited.com>
comp.lang.javascript FAQ - http://jibbering.com/faq

[Thomas 'PointedEars' Lahn]

ja********@gmail.com wrote:

<select name=\"prior22345\" class=\"noprint\" ^^ ^^ ^^ ^^ onChange=\"javascript:changePrior(22345)\" id=\"22345\"> ^^ ^^ ^^ ^^ <option value=\"0\">0</option> ^^ ^^ <option value=\"1\">1</option> ^^ ^^ <option value=\"2\">2</option> ^^ ^^ <option value=\"3\">3</option> ^^ ^^ <option value=\"4\">4</option> ^^ ^^ <option value=\"5\">5</option> ^^ ^^ <option value=\"6\">6</option> ^^ ^^ <option value=\"7\">7</option> ^^ ^^ <option value=\"8\">8</option> ^^ ^^ </select>
How do you got the idea that you should escape
attribute value delimiters when used as such?
this is the image i'm changing:

<img src='images/icons/order0.gif' id='prior22345'>
That `img' element lacks the mandatory `alt' attribute.

<http://validator.w3.org/>
the function i'm executing:

function changePrior( waid )
{
prioriteit = document.getElementById( waid ).value;
document.getElementById('prior'+ waid).src = 'images/icons/order' +
prioriteit + '.gif';

Use collections instead:

var e, prioriteit =
(e = document.forms[...].elements['prior' + waid])
.options[e.selectedIndex].value;

document.images['prior' + waid].src =
'images/icons/order' + prioriteit + '.gif';

This way you also work around issues with namespaces.

Don't use `javascript:' URIs in event handler attribute values but
declare the default scripting language instead using a `meta' element.
PointedEars