0

I am currently using Organic Simple Configurable Products extension for Magento CE 1.9.3.2 I have configurable products that are successfully changing the price displayed for the products total price after selecting my options.

I am trying to get the price of a configuration to display in the swatch.

To help understand the question i will give an example scenario.

Say I have a product of T-shirts that have a variation on the Size of Small/Medium which is displayed as a drop down.

I also have a variation of Quantities, 5/10/20 this variation is displayed as a swatch.

example prices:
Small - 5: £10
Small - 10: £18
Small - 20: £34
Medium - 5: £12
Medium - 10: £22
Medium - 20: £40

What I want is for the swatch to display the price when selecting the quantity

eg i have selected small in the size dropdown so the quantity swatches should update to show.

5 £10    10 £18    20 £34

and if i change the dropdown to medium then the prices in the quantity swatch will change to

5 £12    10 £22    20 £40

I have spent a lot of time pouring over the code but i haven't got a clue what does what and where and i would appreciate some direction or code.

0

After pouring over the code for over 2 days, I have managed to solve it myself. Thought I would provide the result for anyone wanting to do this themselves. (Feel free to show me a simpler way)

First I created a global dropdown attribute called "config_standard_quantity" this i make a swatch by selecting this attribute as a swatch by navigation to:

System > Configuration > Configurable Swatches > General Settings > Product Attributes to Show as Swatches in Product Detail

Next I wanted the default magento quantity to be hidden if the product being displayed had the attribute "config_standard_quantity" i did this by editing the file

app\design\frontend\theme\childTheme\template\catalog\product\view\addtocart.phtml

find:

<label for="qty"><?php echo $this->__('Qty:') ?></label>
<div class="qty-holder">
    <input type="text" name="qty" id="qty" maxlength="12" value="<?php echo $this->getProductDefaultQty() * 1 ?>" title="<?php echo $this->__('Qty') ?>" class="input-text qty" />
    <div class="qty-changer">
        <a href="javascript:void(0)" class="qty_inc"><i class="icon-up-dir"></i></a>
        <a href="javascript:void(0)" class="qty_dec"><i class="icon-down-dir"></i></a>
    </div>
</div>

replace with:

<?php if(!$_product->isGrouped() and !$_product->getResource()->getAttribute('config_standard_quantity')): ?>
<label for="qty"><?php echo $this->__('Qty:') ?></label>
<div class="qty-holder">
    <input type="text" name="qty" id="qty" maxlength="12" value="<?php echo $this->getProductDefaultQty() * 1 ?>" title="<?php echo $this->__('Qty') ?>" class="input-text qty" />
    <div class="qty-changer">
        <a href="javascript:void(0)" class="qty_inc"><i class="icon-up-dir"></i></a>
        <a href="javascript:void(0)" class="qty_dec"><i class="icon-down-dir"></i></a>
    </div>
</div>
<?php endif; ?>

lastly i made changes to the javascript file that make the updates to the prices

skin/frontend/base/default/js/scp_product_extension.js

before editing copy this file to your active theme then make the following changes.

add the following functions:

Product.Config.prototype.getInScopeQtyProductIds = function (optionalAllowedProducts) {
    var childProducts = this.config.childProducts;
    var allowedProducts = [];

    if ((typeof optionalAllowedProducts != 'undefined') && (optionalAllowedProducts.length > 0)) {
        // alert("starting with: " + optionalAllowedProducts.inspect());
        allowedProducts = optionalAllowedProducts;
    }

    for (var s = 0, len = this.settings.length - 2; s <= len; s++) {
        if (this.settings[s].selectedIndex <= 0) {
            break;
        }
        var selected = this.settings[s].options[this.settings[s].selectedIndex];
        if (s == 0 && allowedProducts.length == 0) {
            allowedProducts = selected.config.allowedProducts;
        } else {
            // alert("merging: " + allowedProducts.inspect() + " with: " + selected.config.allowedProducts.inspect());
            allowedProducts = allowedProducts.intersect(selected.config.allowedProducts).uniq();
            // alert("to give: " + allowedProducts.inspect());
        }
    }

    //If we can't find any products (because nothing's been selected most likely)
    //then just use all product ids.
    if ((typeof allowedProducts == 'undefined') || (allowedProducts.length == 0)) {
        productIds = Object.keys(childProducts);
    } else {
        productIds = allowedProducts;
    }
    return productIds;
};

Product.Config.prototype.getQtyOptionCount = function () {
    for (var s = 0, len = this.settings.length - 1; s <= len; s++) {
        if (this.settings[s].config.code == "config_standard_quantity") {
            var data = {count: this.settings[s].config.options.length};
            data["options"] = new Object();
            for (var o = 0, olen = this.settings[s].config.options.length - 1; o <= olen; o++) {
                data["options"][o] = new Object();
                data["options"][o]["label"] = this.settings[s].config.options[o].label;
                data["options"][o]["allowedProducts"] = this.settings[s].config.options[o].products;
            }
        }
    }
    return data;
};

Product.Config.prototype.updateSwatchPrice = function (label, price) {
    $$('.option-' + label + ' p').each(function (el) {
        el.innerHTML = label+price;
    });
};

Go to function:

Product.Config.prototype.reloadPrice = function () {

after:

var childProductId = this.getMatchingSimpleProduct();

paste the following:

var qtyProductIds = this.getInScopeQtyProductIds();
var qtyOptionsData = this.getQtyOptionCount();

at the end of the function add:

if (qtyProductIds.length == qtyOptionsData.count) {
    for (var q in qtyOptionsData.options) {
        for (var p = 0, len = qtyProductIds.length - 1; p <= len; p++) {
            if (Object.values(qtyOptionsData.options[q].allowedProducts).indexOf(qtyProductIds[p]) > -1) {
                var swatchPrice = this.getTaxPrices(childProducts[qtyProductIds[p]]["price"]);
                if (this.taxConfig.showBothPrices) {
                    var str = '<br /><span>' + this.formatPrice(swatchPrice[2], false) + '</span><br /><span class="tax-subclass">' + this.formatPrice(swatchPrice[1], false) + ' ' + this.taxConfig.inclTaxTitle+ '</span>';
                } else {
                    var str = '<br /><span>' + this.formatPrice(swatchPrice[0], false) + '</span><br />';
                }


                this.updateSwatchPrice(qtyOptionsData.options[q].label, str);
            }
        }
    }
}

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.