Update price on front end for configurable product - Magento

Question

I have created a template in Magento and have added some configurable products. When you select the drop down, the change in price is displayed (eg +6) and this is reflected in the shopping cart.

However, I would like it to upadte the regular and special price on the product page. Is there a way to do this, or is it static html?

Cheers

http://www.titan.x-brand.co.uk/bath-panels/trojan-supastyle-750mm-acrylic-end-panel.html

Answer 1

Price and special price html is not hadr coded - it is changed by javascript Product.OptionsPrice (declared in app/design/frontend/base/default/template/catalog/product/view.phtml)

var optionsPrice = new Product.OptionsPrice(<?php echo $this->getJsonConfig() ?>);

Implementation of the class is in javascript file js/varien/products.js

The function that should change the price is Product.OptionsPrice.reload

That JS object expects your price and special price html elements to be in certain hierarchy (

<span><span>...</span></span>

this is only an example what I mean by hierarchy) and the elements of this hierarchy must have certain class and id attributes that should not be removed or renamed.

Your changes to phtml files have caused this code to fail (if you inspect your page with firebug you'll notice that there are javascript errors present - not necessarily related to this issue but you should fix them).

The easiest way to start fixing this is that you copy the section of html, related to price, from default phtml file and reapply css once it works.

Also if you have changed the theme through admin (System->Configuration->Design->Package->Current Package Name) you could change it from 'your_theme' back to 'default' and see how it is supposed to work.