Magento Question posted in
The official documentation can be found here.

Magento 2 – How can I change the quantity of a product (on product page) with php or js?

I am looking for a way to change the value of the quantity box from the code in stead of manually changing it on the product page.

$Uitkomst has to be in the input once the form is submitted.

I haven’t been able to find the answer to my problem so any help at all would be much appreciated.

Thanks in advance.

the value which I need in the qty input comes from this form:

<form action="?" method="POST">
   <table>
      <tr>
         <td>
            <input name="breedte" type="text" maxlength="40" placeholder="Breedte (in millimeters)" required>
         </td>
      </tr>
      <tr>
         <td>
            <input name="lengte" type="text" maxlength="40"  placeholder="Lengte (in millimeters)" required>
         </td>
      </tr>
      <tr>
         <td>
            <input type="submit" value="Toevoegen aan winkelwagen">
         </td>
      </tr>
   </table>
</form>
<?php
   if (isset($_POST["lengte"]))
   {
       $Lengte = $_POST["lengte"];
       $Breedte = $_POST["breedte"];
       $Uitkomst = $Lengte * $Breedte;
       echo $Uitkomst;
       
   }
   ?>     
<div class="control">
   <input
      name="qty"
      id="qty"
      value="<?= block->getProductDefaultQty() * 
         1 ?>"
      title="<?= $block->escapeHtmlAttr(__('Qty')) ?>"
      class="input-text qty"
      />
</div>
Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    I have found the solution to my problem,

    in a CustomForm.phtml file I put

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

/** @var $block MagentoCatalogBlockProductView */
?>
<?php $_helper = $this->helper('MagentoCatalogHelperOutput');?>
<?php $_product = $block->getProduct(); ?>
<div>
    <div class="CalculatorForm">
        <form onsubmit="event.preventDefault();fillQty();" id="form_id">
            <table>
                <tr>
                    <td>
                        <input name="breedte" type="number" maxlength="40" placeholder="Breedte (in millimeters)" required>
                    </td>
                </tr>
                <tr>
                    <td>
                        <input name="lengte" type="number" maxlength="40"  placeholder="Lengte (in millimeters)" required>
                    </td>  
                </tr>  
                <tr>
                    <td>
                        <input type="submit" value="Bereken prijs">
                    </td>
                </tr>
            </table>
        </form>
        <div class="field qty">
            <!--<?php #if ($block->shouldRenderQuantity()) :?>-->
            <label class="label" for="qty"><span><?= $block->escapeHtml(__('Qty')) ?></span></label>
            <div class="control">
                <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())) ?>"
                />
            </div>
            <?php #endif; ?>
            <script>
                function fillQty(){
                    $('#qty').val($('input[name="breedte"]').val() * $('input[name="lengte"]').val());
                    return false;};
            </script>
        </div>
    </div>
</div>

    and in the original addtocart.phtml I put

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

/** @var $block MagentoCatalogBlockProductView */
?>
<?php $_helper = $this->helper('MagentoCatalogHelperOutput');?>
<?php $_product = $block->getProduct();?>
<?php $_product = $block->getProduct(); ?>
<?php $buttonTitle = __('Add to Cart'); ?>
<?php if ($_product->isSaleable()) :?>
<div class="box-tocart">
    <div class="fieldset">
        <div class="control">
            <?php if ($block->shouldRenderQuantity()) :?>
                <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())) ?>"
                />
            <?php endif ?>
        </div>
        <div class="actions">
            <button 
                type="submit"
                title="<?= $block->escapeHtmlAttr($buttonTitle) ?>"
                class="action primary tocart"
                id="product-addtocart-button">
                <span>
                    <?= $block->escapeHtml($buttonTitle) ?>
                </span>
            </button>
            <?= $block->getChildHtml('', true) ?>
        </div>
        <?php endif; ?>
        <script type="text/x-magento-init">
        {
            "#product_addtocart_form": {
                "Magento_Catalog/js/validate-product": {}
        }
        </script> 
    </div>
</div>

    I also put <script src="{{MEDIA_URL}}jQuery-3.3.1.js?v=1.x"></script> in the html head in the magento backend.

    this solved my problem. thanks everyone.


  2. 0

    Changed the answer also abit.

    It does not refresh the page, is that what you need?

        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <form onsubmit="event.preventDefault();fillQty();" id="form_id">
       <table>
          <tr>
             <td>
                <input name="breedte" type="text" maxlength="40" placeholder="Breedte (in millimeters)" required>
             </td>
          </tr>
          <tr>
             <td>
                <input name="lengte" type="text" maxlength="40"  placeholder="Lengte (in millimeters)" required>
             </td>
          </tr>
          <tr>
             <td>
                <input type="submit" value="Toevoegen aan winkelwagen">
             </td>
          </tr>
       </table>
    </form>    
    <div class="control">
       <input
          type="text"
          name="qty"
          id="qty"
          value="<?= block->getProductDefaultQty() * 
             1 ?>"
          title="<?= $block->escapeHtmlAttr(__('Qty')) ?>"
          class="input-text qty"
          />
    </div>
    <script>
      function fillQty() {
        $('#qty').val($('input[name="breedte"]').val() * $('input[name="lengte"]').val());
        return false;
      };
    </script>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search