Multiple variants and quantities with one submit

[Charles_Marsh]

Hello All,

Just windering if there is anyone who can spot the problem with the function I'm trying to create.

I need to be able to add multiple quantities of different product variants to the cart with one submit button.

Everything is working correctly apart from the quantities, it acts a little random...

e.g

Shirts

small - quantity

medium - quantity

large - quantity

Add to cart

Here is the relative code, all I'm doing is adding the button to the last loop of forms then using that button to submit several forms.

<ul class="pd_list">
    {% for product in collections.wholesale-item.products %}
        <li>
            <div class="pdimage">
                <div class="pdimg">
                    <a href="{{product.url | within: collection}}"><img src="{{ product.featured_image | product_img_url: 'thumb' }}" alt="{{product.title}}" /></a>
                </div>
                {% for variant in product.variants %}
                <form id="product-form1-{{variant.id}}" action="/cart/add" method="post">
                    {% if variant.available == true %}
                    <p class="order">
                        <input type="hidden" name="id[]" value="{{variant.id}}" id="P_{{variant.id}}" />
						<h2>{{  variant.title }}</h2>
						<input id="quantity" type="text" name="quantity" value="0" size="3"/>
                    </p>
                    {% else %}
                        <p class="outofstock">Sorry! We're out of stock!</p>
                    {% endif %}
					{% if forloop.last %}
					<input type="submit" name="add" value="Add"  style="margin-top:6px;" onclick="{% for variant in product.variants %}Shopify.addItemFromForm('product-form1-{{variant.id}}');{% endfor %} return false;" />
					{% endif %}
                </form>
                {% endfor %}
            </div>
        </li>
    {% endfor %}
</ul>

[jahangir]

This thread is quite old, but if this helps others who are looking for the same solution for adding multiple variants and quantities with one submit.

You can use the MultiVariants ‑ Bulk Order app (free plan available) to allow your customers to order multiple variants and quantities of the same product in just one click.

Here is the demo, you can take a look.

MultiVariants Bulk order grid view