2

I tried to move an element to above add-to-cart block at category page.

Please check the following attachments.

enter image description here

I need as the following:

enter image description here

For product availability, I am using an extension. The name of that plugin for the element is mageArray.checkDelivery.

I used the following at my layout default.xml file as follows:

<move element="product.info.addtocart" destination="product.info.main" after="mageArray.checkDelivery"/>

**I tried the above code to change the position of the product availability block. **

Then I get the layout of add to cart and pin availability as per my requirement.

But, from now, add to cart is not working.

My website : https://www.depoto.com/taparia-mh200-machinist-hammers-with-handle.html

  • Have you check console or error log? – Dhiren Vasoya Oct 10 at 11:17
3

your AddtoCart Button out of the form id="product_addtocart_form"

enter image description here

please move your addtocart Button with form like:

enter image description here

xml move

<move element="product.info" destination="product.info.main" after="mageArray.checkDelivery"/>

Hope this will help you. thanks

  • Yes, i just seen that its out of form. Can you tell me how to do it it form? – Teja Bhagavan Kollepara Oct 10 at 11:28
  • 1
    <move element="product.info" destination="product.info.main" after="mageArray.checkDelivery"/> – Ranjeet Kumar Oct 10 at 11:35
  • 1
    thanks its working. <move> above code – Teja Bhagavan Kollepara Oct 10 at 11:48
  • @RanjeetKumar, please add the move code in answer. then i can accept – Teja Bhagavan Kollepara Oct 12 at 4:31
  • @TejaBhagavanKollepara my answer updated. thanks – Ranjeet Kumar Oct 15 at 13:38
3

I have to check your website and I have to find it what is an exact issue on your site. In your addtocart action form action not available

Your AddtoCart HTML:-

<div class="box-tocart">
        <div class="fieldset">
                <div class="field qty">
            <label class="label" for="qty"><span>Qty:</span></label>
            <div class="control">
                <input type="number" name="qty" id="qty" maxlength="12" value="1" title="Qty" class="input-text qty" data-validate="{&quot;required-number&quot;:true,&quot;validate-item-quantity&quot;:{&quot;minAllowed&quot;:1,&quot;maxAllowed&quot;:10000}}">
                <div class="qty-changer">
                    <a href="javascript:void(0)" class="qty-inc"><i class="porto-icon-up-dir"></i></a>
                    <a href="javascript:void(0)" class="qty-dec"><i class="porto-icon-down-dir"></i></a>
                </div>
            </div>
        </div>
                <div class="actions">
            <button type="submit" title="Add to Cart" class="action primary tocart" id="product-addtocart-button">
                <span>Add to Cart</span>
            </button>
</div>

My AddtoCart HTML:-

<div class="product-add-form">
    <form data-product-sku="sdfggdsfsdfsd" action="http://localhost/c/index.php/checkout/cart/add/uenc/aHR0cDovLzE5Mi4xNjguMC4xMC9jL2luZGV4LnBocC9zZGZnZ2RzZi5odG1s/product/75/" method="post" id="product_addtocart_form" novalidate="novalidate">
        <input type="hidden" name="product" value="75">
        <input type="hidden" name="selected_configurable_option" value="">
        <input type="hidden" name="related_product" id="related-products-field" value="">
        <input type="hidden" name="item" value="75">
        <input name="form_key" type="hidden" value="lGxI5yhFm66Nw1rc">                            
        <div class="box-tocart">
            <div class="fieldset">
                <div class="field qty">
                    <label class="label" for="qty"><span>Qty:</span></label>
                    <div class="control">
                        <input type="number" name="qty" id="qty" maxlength="12" value="1" title="Qty" class="input-text qty" data-validate="{&quot;required-number&quot;:true,&quot;validate-item-quantity&quot;:{&quot;minAllowed&quot;:1,&quot;maxAllowed&quot;:10000}}">
                        <div class="qty-changer">
                            <a href="javascript:void(0)" class="qty-inc"><i class="porto-icon-up-dir"></i></a>
                            <a href="javascript:void(0)" class="qty-dec"><i class="porto-icon-down-dir"></i></a>
                        </div>
                    </div>
                </div>
                <div class="actions">
                    <button type="submit" title="Add to Cart" class="action primary tocart" id="product-addtocart-button">
                        <span>Add to Cart</span>
                    </button>

                </div>
            </div>
        </div>

</form>
</div>

Check below xml to move addtocart element

<move element="product.info" destination="product.info.main" after="mageArray.checkDelivery"/>

Hope this will help you..!

  • check it I have updated my answer – Devidas Oct 10 at 11:33

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.