OnChange Event Problem - Please Help

[Lee Mundie]

Hi there,
Simple problem here but can't seem to fix it!

Okay, I have a select list from which people choose avatars...

the list is option values ie. <option>Worm</option> <option>Frog</option>
etc etc and is in an include file...
where the word i.e. worm sources the image ..images/worm.gif - simple so
far...

okay main problem is the onChange event in the select tag... which when you
select a new avatar on the list, the image preview should update... but it
doesn't
works on my DB update and refresh, but want it to preview as they select it
before update.


Anyone help

Thanks in Advance

Lee


<select name="SelectAvatar" class="avatar" onChange="(avatar.src =
SelectAvatar.options[SelectAvatar.selectedIndex].value) &&
(oldAvatar.value='')">

<option value="<% = strAvatar %>"><% If strAvatar = "" Then Response.Write
"None Selected" Else Response.Write strAvatar %></option>
<!-- #include file="forum/selectavatar.asp" -->
</select>

<img src="shared/avatars/<%

'If there is an avatar then display it
If strAvatar <> "" Then
Response.Write(strAvatar)
Else
Response.Write("noneselected")
End If
%>.gif" width="32" height="32" name="avatar">

<input type="hidden" name="oldAvatar" value="<% = strAvatar %>">

 

[Lasse Reichstein Nielsen]

the list is option values ie. <option>Worm</option> <option>Frog</option>

<select name="SelectAvatar" class="avatar" onChange="(avatar.src =
SelectAvatar.options[SelectAvatar.selectedIndex].value) &&
(oldAvatar.value='')">

Your options don't have values. Try this onchange attribute:
onchange = "document.images['avatar'].src =
this.options[this.selectedIndex].text;
this.form.elements['oldAvatar'].value = '';"

It should even work in Mozilla, which your code didn't.

(Server-side code is not relevant here. Next time, please show us
the generated code without the ASP)

/L

 

[Stuart Palmer]

<form name="test">
<select name="SelectAvatar" class="avatar" onChange="(test.avatar.src =
test.SelectAvatar.options[test.SelectAvatar.selectedIndex].value);(oldAvatar
..value=''); alert(test.oldAvatar.value); alert(test.avatar.src);">

<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>

<img src="shared/avatars/name.gif" width="32" height="32" name="avatar">


<input type="hidden" name="oldAvatar" value="">
</form>

Seems to work for me, I don't get what you were trying o do with the &&
(this is a comarison call in iff statements etc). I have set some alerts to
show you values of fields for you.

Hope this helps.

Stu

 

[Richard Cornford]

Hi there,
Simple problem here but can't seem to fix it!

Okay, I have a select list from which people choose avatars...

I have read this before recently haven't I? Of course I stopped reading
that message at about this point because it was HTML on a text only
newsgroup.

the list is option values ie. <option>Worm</option>
<option>Frog</option> etc etc and is in an include file...

Include file? I see no include file. But if the option elements take
that form then they have no value attributes and so may have no value
properties.

where the word i.e. worm sources the image ..images/worm.gif -
simple so far...

<select name="SelectAvatar" class="avatar"
onChange="(avatar.src =
SelectAvatar.options[SelectAvatar.selectedIndex].value) &&
(oldAvatar.value='')">

Assuming your description of the option elements above is inaccurate and
they do indeed have a value attribute, these property accessors are not
very cross browser. They will work on a lot of browsers but could also
work on many others. In the internally generated function (which is
based on taking the onchange attribute string and using that as the
function body) the - this - keyword refers to the select element because
the onchange function is a method of that object, so - this - could (and
should) be used in place of - SelectAvatar -

this.options[this.selectedIndex].value

The IMG element with the name "avatar" will not necessarily be resolved
by the use of its name as an identifier (it’s a guaranteed failure on
Opera 6 when it is not spoofing IE for example). The broadest support
for referencing named IMG elements is via the document.images
collection, ie:-

document.images['avatar'].src = . . . ;

The circumstance is similar for - oldAvatar - but because that is a
hidden input element in the current form it would be best to reference
that in the form's elements collection. As each form element has a
property called "form" that refers to the form that contains it and -
this - refers to a form element (the select) - oldAvatar - can be
referenced in the form's elements collection with:-

this.form.elements['oldAvatar'].value = '';

<option value="<% = strAvatar %>">
<% If strAvatar = "" Then Response.Write

This is not client-side code. If you have client-side problems it is
almost always useless to look at the server-side code, you need to view
the source in the client because that is the code that the browser is
executing and that is where you will find the errors. And showing server
side code to someone else without explaining _exactly_ what values are
likely to be being written into, for example, the above value attribute,
or the contents of selectavatar.asp makes any comment about possible
causes of errors pure guesswork. When, looking at the code that is
arriving at the browser would probably make the problem instantly
obvious.

"None Selected" Else Response.Write strAvatar %></option>
<!-- #include file="forum/selectavatar.asp" -->
</select>

<img src="shared/avatars/<%

'If there is an avatar then display it
If strAvatar <> "" Then
Response.Write(strAvatar)
Else
Response.Write("noneselected")
End If
%>.gif" width="32" height="32" name="avatar">

<snip>

But here is my guess, above you have written - strAvatar - into a value
attribute, but here you feel the need to add a dot GIF extension (and a
path) to that string. However, when you assign the value form the
selected option to the SRC attribute of the IMG element you are not
adding a dot GIF extension (or a path). Could it be that without the
extension (and/or path) the server is failing to find the corresponding
file and just returning errors?

Richard.