Magento 2 – How to Dynamically Change Price on Product Page

custom-optionsmagento2priceproduct

I am trying to update price of product on product page. So I am updating the span of price by getting product price + my additional price, but problem is when we use custom options.

Is there any event or plugin available using which I can add our price at final even after custom option.

Thank you,

Best Answer

OK ! I found one solution to change the price on product page itself using Javascript:

require(["jquery","Magento_Catalog/js/price-utils"], function(jQuery,priceUtils) {
    var productPrice = parseFloat(jQuery('span.price-final_price > span[data-price-type="finalPrice"]').attr('data-price-amount'));
    var finalPrice=100;
    formatedPrice = priceUtils.formatPrice(parseInt(finalPrice));
    jQuery('span.price-final_price > span.price-wrapper > span.price').text(formatedPrice);
    var finalPrice=productPrice+(pricePerText*textObjects)+(pricePerImage*imageObjects);
    formatedPrice = priceUtils.formatPrice(parseInt(finalPrice));
    jQuery('span.price-final_price > span.price-wrapper > span.price').text(formatedPrice);
}); // Required

Related Solutions

Product Price Updated with Javascript Half Down in Magento 1.7

I think you could use a hack for this. Edit in js/varien/products.js file the function formatPrice:

formatPrice: function(price) {
    price = (Math.round(price*100)/100);

    return formatCurrency(price, this.priceFormat);
}

Magento – Update price in multiple areas on product page

You can actually have all the ids listed here

initPrices: function() {
    this.containers[0] = 'product-price-' + this.productId;
    this.containers[1] = 'bundle-price-' + this.productId;
    this.containers[2] = 'price-including-tax-' + this.productId;
    this.containers[3] = 'price-excluding-tax-' + this.productId;
    this.containers[4] = 'old-price-' + this.productId;
},

However this doesn't answer your question. To help you out, you can actually have all of those again, suffixed with _clone

For example you can have

product-price-1234
 and
product-price-1234_clone

A bit odd, but this is permitted here:

if ($(pair.value+this.duplicateIdSuffix)) {
    $(pair.value+this.duplicateIdSuffix).innerHTML = formattedPrice;
}

Were this.duplicateIdSuffix is '_clone'.

TLDR; You can have prices listed at most twice by using the _clone suffix on the second id. Why? Magento's weird.

Best Answer

Related Solutions

Product Price Updated with Javascript Half Down in Magento 1.7

Magento – Update price in multiple areas on product page

Related Topic