1

If I change the Quantity for a product in product view page, the price has to change automatically. How can it be achieved?

Please help me to do this.

CODE:-

<?php
/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */

/** @var $block \Magento\Catalog\Block\Product\View */
?>
<?php $_product = $block->getProduct(); ?>
<?php $buttonTitle = __('Add to Cart'); ?>
<?php if ($_product->isSaleable()) :?>
<div class="box-tocart">
    <div class="fieldset">
        <?php if ($block->shouldRenderQuantity()) :?>
        <div class="field qty">
            <label class="label" for="qty"><span><?= $block->escapeHtml(__('Quantity')) ?></span></label>
            <div class="control">
                <span id="dec" class="btn btn-info-minus">-</span>
                <input type="number"
                   name="qty"
                   id="qty"
                   min="0"
                   value="<?= $block->getProductDefaultQty() * 1 ?>"
                   title="<?= $block->escapeHtmlAttr(__('Qty')) ?>"
                   class="input-text qty"
                   data-validate="<?= $block->escapeHtmlAttr(json_encode($block->getQuantityValidators())) ?>"
                   />
                <span id="inc" class="btn btn-info-plus">+</span>
            </div>
        </div>
        <?php endif; ?>

        <div class="product-add-info">
            <?php 
            //echo $this->getLayout()->createBlock('Magento\Cms\Block\Block')->setBlockId('product-page-delivery')->toHtml();
            echo $_product->getData('delivery_info');

            ?>

            <?php //echo $block->getChildHtml('product.info.price');?>
            <?php //echo $this->getLayout()->createBlock('Mageplaza\HelloWorld\Block\HelloWorld')->setTemplate('Mageplaza_HelloWorld::helloworld.phtml')->toHtml(); ?>
            <?php 
                $arguments = [];
                $priceType = \Magento\Catalog\Pricing\Price\FinalPrice::PRICE_CODE;
                $priceRender = $this->getLayout()->getBlock('product.price.render.default');
                $arguments['zone'] = \Magento\Framework\Pricing\Render::ZONE_ITEM_LIST;
                $price = '';
                if($priceRender) {
                    $price = $priceRender->render($priceType, $_product, $arguments);
                }
                 echo $price;
            ?>
             <span id="test"></span>

            <div class="actions">
                <button type="submit"
                        title="<?= $block->escapeHtmlAttr($buttonTitle) ?>"
                        class="action primary tocart"
                        id="product-addtocart-button" disabled>
                    <span><?= $block->escapeHtml($buttonTitle) ?></span>
                </button>
                <?php //echo $block->getChildHtml('', true) ?>
            </div>
        </div>
    </div>
</div>
<?php endif; ?>
<script type="text/x-magento-init">
    {
        "#product_addtocart_form": {
            "Magento_Catalog/js/validate-product": {}
        }
    }
</script>
<script>
    require(['jquery'],
    function ($) {
        jQuery('#inc').on('click',function(){
            var $qty=$(this).closest('.box-tocart').find('.input-text');
            var currentVal = parseInt($qty.val());
            if (!isNaN(currentVal)) {
                $qty.val(currentVal + 1);
            }
        });
        jQuery('#dec').on('click',function(){
            var $qty=$(this).closest('.box-tocart').find('.input-text');
            var currentVal = parseInt($qty.val());
            if (!isNaN(currentVal) && currentVal > 1) {
                $qty.val(currentVal - 1);
            }
        });
    });
</script>
<script>
    require(['jquery'],
    function ($) {
    var price = $(".price-wrapper.price-including-tax span.price").html();
    // var price=$("#price").val();
    jQuery("#qty").on("change",function(){
    qty=$("#qty").val();
    alert(price);
    alert(qty);
    var total_price=price*qty;
    alert(total_price);
    jQuery("#test").html(total_price);
    alert(total_price);

}) 
});   
</script>

Feature Explanation Image

5
  • please share your code
    – Msquare
    Sep 12 '20 at 5:48
  • Check my update question.i have add code Sep 12 '20 at 5:52
  • where you put this file and you use default price box or custom price box ?
    – Msquare
    Sep 12 '20 at 6:00
  • Above code is addtocart.phtml file code Sep 12 '20 at 6:00
  • please check and update me.
    – Msquare
    Sep 12 '20 at 6:55
1

Try this code

<?php
/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */

/** @var $block \Magento\Catalog\Block\Product\View */
?>
<?php $_product = $block->getProduct(); ?>
<?php $buttonTitle = __('Add to Cart'); ?>
<?php if ($_product->isSaleable()) :?>
<div class="box-tocart">
    <div class="fieldset">
        <?php if ($block->shouldRenderQuantity()) :?>
        <div class="field qty">
            <label class="label" for="qty"><span><?= $block->escapeHtml(__('Quantity')) ?></span></label>
            <div class="control">
                <span id="dec" class="btn btn-info-minus">-</span>
                <input type="number"
                   name="qty"
                   id="qty"
                   min="0"
                   value="<?= $block->getProductDefaultQty() * 1 ?>"
                   title="<?= $block->escapeHtmlAttr(__('Qty')) ?>"
                   class="input-text qty"
                   data-validate="<?= $block->escapeHtmlAttr(json_encode($block->getQuantityValidators())) ?>"
                   />
                <span id="inc" class="btn btn-info-plus">+</span>
            </div>
        </div>
        <?php endif; ?>

        <div class="product-add-info">

            <div class="actions">
                <button type="submit"
                        title="<?= $block->escapeHtmlAttr($buttonTitle) ?>"
                        class="action primary tocart"
                        id="product-addtocart-button" disabled>
                    <span><?= $block->escapeHtml($buttonTitle) ?></span>
                </button>
                <?php //echo $block->getChildHtml('', true) ?>
            </div>
        </div>
    </div>
</div>
<?php endif; ?>
<script type="text/x-magento-init">
    {
        "#product_addtocart_form": {
            "Magento_Catalog/js/validate-product": {}
        }
    }
</script>

<?php

$prd_price = $_product->getPrice();

?>
<script>
    require(['jquery'],
    function ($) {
        jQuery('#inc').on('click',function(){
            var $qty = jQuery(this).closest('.box-tocart').find('.input-text');
            var currentVal = parseInt($qty.val());
            if (!isNaN(currentVal)) {
                $qty.val(currentVal + 1);
                var input_qty = <?php echo $prd_price; ?> * (currentVal + 1);
                price_show = parseFloat(input_qty).toFixed(2);
                var price_get = jQuery(".product-info-main .price-box.price-final_price span.price").text();
                var new_sub_text = price_get.replace(/\d+/g, '');
                new_sub_text = new_sub_text.replace(".", '');
                jQuery(".product-info-main .price-box.price-final_price span.price").text(new_sub_text+price_show);
            }
        });
        jQuery('#dec').on('click',function(){
            var $qty = jQuery(this).closest('.box-tocart').find('.input-text');
            var currentVal = parseInt($qty.val());
            if (!isNaN(currentVal) && currentVal > 1) {
                $qty.val(currentVal - 1);
                var input_qty = <?php echo $prd_price; ?> * (currentVal - 1);
                price_show = parseFloat(input_qty).toFixed(2);
                var price_get = jQuery(".product-info-main .price-box.price-final_price span.price").text();
                var new_sub_text = price_get.replace(/\d+/g, '');
                new_sub_text = new_sub_text.replace(".", '');
                jQuery(".product-info-main .price-box.price-final_price span.price").text(new_sub_text+price_show);
            }

        });


    });
</script>
7
  • I will check and update you. thank you Sep 12 '20 at 7:02
  • i have check your code but is it not working properly. check this image :- prnt.sc/ufylcj @Msquare Sep 12 '20 at 7:10
  • there is one line issue this line var input_qty = <?php echo $prd_price; ?> * (currentVal - 1); don't worry i update my answer please check it and update me.
    – Msquare
    Sep 12 '20 at 8:05
  • @MohitPatel Please check and update me and you also update me on this answer magento.stackexchange.com/a/321464/82670
    – Msquare
    Sep 12 '20 at 9:07
  • Hello @Msquare i have your update code all is working fine but one issue found.i have increase or de-crease button click currency symbol is increase. :- prnt.sc/ug19g3 Sep 12 '20 at 11:19

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.