Last days as a result of some customer complains and discussion with our marketing guys I've got a request to change the default behavior of the configurable products options. They asked me to remove the + $xx.xx from the options drop-down as it is confusing the customers/visitors and just leave the available options without displaying the price change. Fair enough from their point of view, but it is a bit tricky from developers point of view I think. The site is running Magento CE 1.6.2, and the file which we need to override/change is /public_html/js/varien/configurable.js. We need to change the getOptionLabel function in it so that it does not display the price change. So my question is: what is the right Magento way to change this file and not touch the core javascript file? Thanks in advance.
3 Answers
How to override \js\varien\configurable.js in Magento 1.9 EE and add new data attribute
Create file \js\jsoverride\configurable.js:
Product.Config.prototype.reloadOptionLabels = Product.Config.prototype.reloadOptionLabels.wrap(function (parentMethod, element) {
var selectedPrice;
if (element.options[element.selectedIndex].config && !this.config.stablePrices) {
selectedPrice = parseFloat(element.options[element.selectedIndex].config.price);
} else {
selectedPrice = 0;
}
for (var i = 0; i < element.options.length; i++) {
if (element.options[i].config) {
element.options[i].text = this.getOptionLabel(element.options[i].config, element.options[i].config.price - selectedPrice);
element.options[i].setAttribute('data-in-stock', element.options[i].config.in_stock);
}
}
});
Create or use file: \app\design\frontend\enterprise\YOUR_THEME\layout\local.xml and add next rows:
<?xml version="1.0"?>
<layout version="0.1.0">
<catalog_product_view>
<reference name="head">
<action method="addJs"><script>jsoverride/configurable.js</script></action>
</reference>
</catalog_product_view>
</layout>
Note, filling data to element.options[i].config.in_stock in file
app\design\frontend\enterprise\YOUR_THEME\template\catalog\product\view\type\options\configurable.phtml
with next row
var spConfig = new Product.Config(UPDATED JSON WITH NEW ATTRIBUTE);
Related