Posting in the Magento forums has been disabled pending the implementation of a new and improved forum solution which should better serve the community.

For new questions please post at magento.stackexchange.com, the community-run support site for the Magento community. We will be providing updates on the new forum solution soon. For questions or concerns please email community@magento.com.

Magento Forum

Change product image based on selected radio button of a bundled item
 
backpack
Jr. Member
 
Total Posts:  22
Joined:  2010-02-19
 

Hi, as stated in the title, I would like to be able to change the product image based on the user’s option on a radio button for a bundled item. For example, I choose a radio button that changes the chassis of a product, the image should also change. This is similar to changing an image based on colour, but not quite the same. I would appreciate any help if you could please point me in the right direction. Thank you very much.

 
Magento Community Magento Community
Magento Community
Magento Community
 
tzyganu
Mentor
 
Avatar
Total Posts:  2205
Joined:  2009-11-18
Bucharest, Romania
 

Here is whet you can try.
Edit app\design\frontend\{interface}\{theme}\template\bundle\catalog\product\view\type\bundle\option\radio.phtml
For each radio button in that file add an ‘onclick’ event. (or something else)
This is to code for a radio input (original)

<input type="radio" onclick="bundle.changeSelection(this)" class="radio" id="bundle-option-<?php echo $_option->getId() ?>" name="bundle_option[<?php echo $_option->getId() ?>]"<?php echo ($_default && $_default->isSalable())?'':' checked="checked" ' ?> value="" />
for the onclick attribute a a new function. Let’s call it changeImage
<input type="radio" onclick="bundle.changeSelection(this);changeImage('some image url')" class="radio" id="bundle-option-<?php echo $_option->getId() ?>" name="bundle_option[<?php echo $_option->getId() ?>]"<?php echo ($_default && $_default->isSalable())?'':' checked="checked" ' ?> value="" />
the function could look like this
function changeImage(imageUrl){
$('Your_main_image_id').src imageUrl;
}

This is just a ‘skeleton’ of what to do. You can do it in whatever way you want.
I hope this helps.

 
Magento Community Magento Community
Magento Community
Magento Community
 
backpack
Jr. Member
 
Total Posts:  22
Joined:  2010-02-19
 

Thanks a lot for replying. When I click on an image from “More Views”, however, the image still links to the old image. Also, when I add the item to the cart, the image is the original image. What would be the best way to handle these “problems”?

 
Magento Community Magento Community
Magento Community
Magento Community
 
tzyganu
Mentor
 
Avatar
Total Posts:  2205
Joined:  2009-11-18
Bucharest, Romania
 

I thought you only needed it for the product details page and it seamed to be the easiest solution.
I have no idea how to keep the changed picture. I don’t even know how to approach this.
I can just recommend looking through the cart files maybe you find something.
The product image in the cart is displayed like this

<?php echo $this->getProductThumbnail()->resize(75); ?>
and getProductThumbnail() looks like this
public function getProductThumbnail()
    
{
        
if (!is_null($this->_productThumbnail)) {
            
return $this->_productThumbnail;
        
}
        
return $this->helper('catalog/image')->init($this->getProduct(), 'thumbnail');
    
}
(see \app\code\core\Mage\Checkout\Block\Cart\Item\Renderer.php)
You can try to set a value for _productThumbnail so you won’t see the default thumbnail.
If you manage to do this post your solution here for everyone to ‘enjoy’.
 
Magento Community Magento Community
Magento Community
Magento Community
Magento Community
Magento Community
Back to top