COMPLETED - Add Multiple Quantities of Product to Cart

Highlighted
Shopify Partner
23 0 0

 

Hello, my name is Erica and I am looking for someone to help with an order form feature on our website. This particular feature will be used on our password protected wholesale store but you can get the idea based on our retail store.

Many of our products i.e. elbow pads (http://shop.g-form.com/collections/all/products/elbow-pads) come in various sizes (8). This way the site is set-up here works fine for our retail site bc most customers only purchase one size but for wholesalers it is a tedious process as they want to select varying quantities of varying sizes at one time. Now when a wholesaler tries to make a purchase they have to keep coming back to the product page and select a new size, add quantity, add to cart, repeat. Up to eight times per product! 

Best case scenario is we would like a page where all of our products are listed with quantity boxes of each product variant listed below the name.  This way a wholesaler can just view the single page order form, add quantities for each item and hit add to cart once.

A possible quick option is to at least have the quantity boxes for each variant of the product listed on that product page.  This would require a wholesaler having to visit each product page but at least it will eliminate the need to specify quantities for each size.

If this is something you have experience with and are interested, please email me at media at g-form dot com

Examples of your work would be greatly appreciated.

Thanks,

Erica

 

 

 

 

0 Likes
Highlighted
Shopify Partner
24 0 0

I'm about halfway there on my site. By adding [] to the id within your loop, it will use the id of each item in the loop. So this is what I have so far:

{% for variant in product.variants %}

   <input type="hidden" name="id[]" value="{{ variant.id }}" />

   {{ variant.title }} <input id="quantity" type="text" name="quantity" value="0" size="3" maxlength="3" /> {{ variant.price | money }}<br />

{% endfor %}

This almost works, except that it gives every item the last quantity in the form. I've seem examples saying to use multiple forms, then on your submit button add javascript to submit each form, but this seems kinda junky to me.

0 Likes
Highlighted
Shopify Partner
24 0 0

This is my latest code:

 

<h1>{{ product.title }}</h1>

<p>{{ product.description }}</p>

{% if product.available %}

   {% for variant in product.variants %}

      <form action="/cart/add" method="post" id="add-item-form-{{ variant.id }}">

         <input type="hidden" name="id" value="{{ variant.id }}" />

         {{ variant.title }}

         <input type="text" name="quantity" value="0" size="3" maxlength="3" />

         {{ variant.price | money }}

      </form>

   {% endfor %}

   <input type="button" value="Add To Cart" onclick="{% for variant in product.variants %}Shopify.addItemFromForm('add-item-form-{{ variant.id }}');{% endfor %}window.location.href='/cart';" />

{% else %}

   This Product Is Currently Not Available

{% endif %}

Still no dice. It keeps giving me this error:

 

  1. Uncaught TypeError: Cannot read property 'parentNode' of null

     

     

    0 Likes
    Highlighted
    Shopify Partner
    23 0 0

    Can I see your web site link?

    0 Likes