0

Possible Duplicate:
jQuery onchange/onfocus select box to display an image?

Looking to be able to change an image dynamically based on the selection option dropdown with an id of "main"

I came across this code which finds the text not the select value, which is exactly what I want. I just need to connect to the image.

alert( 'Text is: ' + $('#attribute119 :selected').text() );

The image is formatted like this

 <img src="mainimage.jpg" id="main">

How would I dynamically change the image based on the option name selected when the form changes? My form looks something like this.

<form name="pds">
<select name="DropDownName" id="attribute119" >
<option value="0">Choose an option...</option>
<option value="2">blue</option>
<option value="3">green</option>
<option value="4">red</option>
</select>
</form>

The images will be named like this.

 "1232_blue.jpg, 1232_red.jpg,etc.".

The color name is followed by the last "_" in the filename

Community
  • 1
  • 1
jeff
  • 313
  • 2
  • 4
  • 10

1 Answers1

1

This should do it:

$('#attribute119').change(function () {
  $('#main').attr('src', '1232_' + $('#attribute119 :selected').text() + '.jpg');
});
g.d.d.c
  • 46,865
  • 9
  • 101
  • 111