cancel
Showing results for 
Search instead for 
Did you mean: 

Update product price to tier price based on quantity entered

Update product price to tier price based on quantity entered

For a configurable product that has tier prices can the unit price on the product page update to the correct tier price based on the quantity that the user enters.

e.g.

  • Buy 100 for £1.55
  • Buy 200 for £1.04 each and save 33%
  • Buy 300 for £0.78 each and save 50%
  • Buy 400 for £0.70 each and save 56%
  • Buy 500 for £0.62 each and save 60%

If the user enters 100, the unit price displays as £1.55 correctly. However if the user enters 200, the unit price remains £1.55 whereas it should display £1.04. It does not display the correct tier price until you add the item to the cart.

2 Comments
Senior Member

Hello,

I exactly faced the same case. So, I came up with the below solution. I hope it helps to someone.

Here is some changes made in addtocart.phtml file in theme.

<?php
$allTiers = $_product->getTierPrice();
$checktiers = array_filter($allTiers);
?>
<?php if (!empty($checktiers)): ?>
      <select name="qty" id="qty" class="qty customizer__qty validation-passed"  data-validate="<?= $block->escapeHtml(json_encode($block->getQuantityValidators())) ?>">
      </select>
      <?php else: ?>
      <input type="number" name="qty" id="qty" value="<?= /* @escapeNotVerified */ $block->getProductDefaultQty() * 1 ?>"
      title="<?= /* @escapeNotVerified */ __('Qty') ?>" class="input-text qty" data-validate="<?= $block->escapeHtml(json_encode($block->getQuantityValidators())) ?>" />
<?php endif; ?>
<script> require([ 'jquery', 'Magento_Catalog/js/price-utils' ], function ($, priceUtils) { 'use strict'; var tierPrices = <?php echo json_encode($allTiers) ?>; var createDropdown = function(){ for(var i = 0; i < tierPrices.length; i++) { var obj = tierPrices[i]; jQuery("select#qty").append("<option value='"+Number(obj.price_qty)+"'>Buy "+Number(obj.price_qty)+" For "+priceUtils.formatPrice(obj.price)+" each</option>") } }; var getPrice = function(qty){ qty = Number(qty); var i = tierPrices.length; while(i--) { if(qty >= tierPrices[i]['price_qty']){ return tierPrices[i]['price']; } } return null; }; var updatePrice = function(price){ var newPrice = priceUtils.formatPrice(price); jQuery('.price-final_price .price').html(newPrice); }; var updatePriceHtml = function(amount){ var price = getPrice(amount); if(price !== null){ updatePrice(price); } }; jQuery('select#qty').change(function(){ if(tierPrices.length > 0) { updatePriceHtml(this.value); } }); setTimeout(function () { if(tierPrices.length > 0) { createDropdown(); updatePriceHtml(jQuery('select#qty').val()); } }, 700); }); </script>

 

 

Frequent Visitor

Hello, very good!

 

I need to do just that. Could you help me and exemplify how to implement in the filea ddtocart.phtml?

I'm in doubt where to apply the code.

 

thank you!