Change image by id

[pmilli0]

Hi sorry if this is the wrong part of the forum, im new here.

 

Im trying to write a javascript function that will change the image according to the product selected, therefore if a window is selected, the image will display, and if its a door a door will be displayed, any tips please. Below is the dropdown which i want to control what item and image is displayed

 

<label for="productRangeID">Type:</label>
<?
$params = array(
'db'=>$GLOBALS['db'],
'table'=>'product_ranges',
'label_field'=>'productRangeName',
'value_field'=>'productRangeID',
'where'=>'WHERE productTypeID=2 OR productTypeID=3',
'order_by'=>'ORDER BY productRangeName',
'group_by'=>'',
'selected_value'=>$productRangeID,
'field_name'=>'productRangeID',
'class'=>'',
'multiple'=>0,
'width'=>'',
'on_change'=>'javascriptroductTypeFormAction()', 
'on_blur'=>'',
'first_option'=>'Select Product Range',
'first_value'=>'',
);
select_renderer::render($params);
?> 

[littledragon]

Hi pmilli0

 

You can alter image src attributes by accessing

 

document.getElementById('image_id').src = 'a_different_image.jpg';

 

most attributes can be accessed in javascript this way.

 

Is that what you're after?

[pmilli0]

Hi pmilli0

 

You can alter image src attributes by accessing

 

document.getElementById('image_id').src = 'a_different_image.jpg';

 

most attributes can be accessed in javascript this way.

 

Is that what you're after?

 

Hi i am trying to change the image, therefore so that when a window is selected an image of a window appears, this is what i have managed so far;

 

function prodImg(imgID) 
{    if(imgSrc) document.getElementById('product_image').src = './images/product_styles' + imgID + '.jpg'; 

}

 

 

[littledragon]

looks good, what's the imgSrc variable?

[pmilli0]

looks good, what's the imgSrc variable?

 

good question, how would i make it into a variable, im in my 3rd week of PHP, so please go easy on me .

[littledragon]

um, no, imgSrc would be a javascript variable, as is imgID

 

what do you want it to represent?  an image source?

 

var imgSrc = document.getElementById('imgID').src;

[pmilli0]

um, no, imgSrc would be a javascript variable, as is imgID

 

what do you want it to represent?  an image source?

 

var imgSrc = document.getElementById('imgID').src;

Hi would i place that in the html section?

[littledragon]

Yeah, in <script type="text/javascript> (code... ) </script> tags.  I think there's a javascript forum here too. Good luck mate! 

[JasonLewis]

what you have here:

 

function prodImg(imgID) 
{    if(imgSrc) document.getElementById('product_image').src = './images/product_styles' + imgID + '.jpg'; 

}

 

now.. where do you set/define this variable: imgSrc

because basically your checking if imgSrc is defined and if it is then your changing the source of the image 'product_image' to the above. but no where in that code is imgSrc defined/set.

[pmilli0]

what you have here:

 

function prodImg(imgID) 
{    if(imgSrc) document.getElementById('product_image').src = './images/product_styles' + imgID + '.jpg'; 

}

 

now.. where do you set/define this variable: imgSrc

because basically your checking if imgSrc is defined and if it is then your changing the source of the image 'product_image' to the above. but no where in that code is imgSrc defined/set.

 

Thanks guys i have solved it now, i was going completely down the wrong route. thanks once again.