Mutli-Item Submission - The Bread Store

Sometimes there is a need though to be able to put more than one line item into the shopping cart at one time. We call this coding format "multi-item submission". The html code differs a bit for these, and we suggest that you tackle standard single items first. When you're ready, visit our very simplistic bread store. The page also provides usage notes for this method.

Try our wonderful bread!

Check all you'd like and click on "add to cart".

  <form action="http://www.cartserver.com/sc/cart.cgi" method="post">
<input type="hidden" name="item" value="s-8882" />
<input type="checkbox" name="item_rye" id="item_rye" value="s-8882^rye^loaf of Rye^2.22^1" />
<label for="item_rye">Rye Loaf<br /></label>
<input type="checkbox" name="item_wheat" id="item_wheat" value="s-8882^wheat^loaf of Wheat^2.22^1" />
<label for="item_wheat">Wheat Loaf<br /></label>
<input type="checkbox" name="item_anything" id="item_anything" value="s-8882^oat^loaf of Oat^2.22^1" />
<label for="item_anything">Oat Loaf<br /></label>
<input type="checkbox" name="item_unique" id="item_unique" value="s-8882^white^loaf of White^2.22^1" />
<label for="item_unique">White Loaf<br /></label>
<input type="checkbox" name="item_works" id="item_works" value="s-8882^hny^loaf of Honey^2.22^1" />
<label for="item_works">Honey Loaf<br /></label>
<input align="center" type="image" border="0" name="add" src="/images/addtocart.gif" />
</form>

Note: We made the first item below be a select box instead of a plain text box to illustrate drop down for quantity. Both methods can work interchangeably as you can see.

Rye Loaf
Wheat Loaf
Oat Loaf
White Loaf
Honey Loaf
  <form class="c2" action="http://www.cartserver.com/sc/cart.cgi" method="post">
<input type="hidden" name="item" value="s-8882" />
<input type="hidden" name="item_rye" value="s-8882^rye^loaf of Rye^2.22^op1" />
<select name="op1_rye">
<option value="0"> 0 </option>
<option value="1"> 1 </option>
<option value="2"> 2 </option>
<option value="3"> 3 </option>
<option value="4"> 4 </option>
<option value="5"> 5 </option>
</select>
Rye Loaf<br />
<!--<input type=text size=2 name=op1_rye value="0">Rye Loaf<br>-->
<input type="hidden" name="item_wheat" value="s-8882^wheat^loaf of Wheat^2.22^op1" />
<input type="text" size="2" name="op1_wheat" value="0" />
Wheat Loaf<br />
<input type="hidden" name="item_anything" value="s-8882^oat^loaf of Oat^2.22^op1" />
<input type="text" size="2" name="op1_anything" value="0" />
Oat Loaf<br />
<input type="hidden" name="item_unique" value="s-8882^white^loaf of White^2.22^op1" />
<input type="text" size="2" name="op1_unique" value="0" />
White Loaf<br />
<input type="hidden" name="item_works" value="s-8882^hny^loaf of Honey^2.22^op1" />
<input type="text" size="2" name="op1_works" value="0" />
Honey Loaf<br />
<input align="center" type="image" border="0" name="add" src="/images/addtocart.gif" />
</form>

This page illustrates two very simple examples of how to put more than one type of item in your basket at the same time. Using this method, you could build a more traditional "order form", or just have a logical grouping of items likely to be ordered together.

In the above example, we assume that a customer wants to buy bread. In all likelyhood, they will want more than one type. To avoid them having to do four "add to cart" functions to buy four types of bread, we offer this method.

We discourage you from building large, single page order forms with all you products on it, although it will work just fine from a technical point of view as far as Americart is concerned. If a single form gets too large, it will start to "act up" on some shopper's browsers, as available memory is exhausted. Instead, we encourage either single item "add to cart"s or logical groupings like the above.

There are coding differences to make multi-item submissions work correctly. We cannot, of course, have all products in a grouping be "name=item", since they would overwrite each other. Instead, we make the "item" variable name be "item_somethingunique". Item part numbers work well for the something-unique part of the variable name. "op" variables must be tagged the same way. "op1_same-unique-as-item". You MUST have the underscore character after "item" and "op1" for it to be parsed correctly.

View the source of this document now, and examine example one.

Example one uses check boxes to "turn on" an item for adding to the cart. It's a really basic example, but note the "name=item_xxxx" convention. Also notice the input type=hidden name=item value="s-8882". The form will work ok without it, but if someone clicks "add to cart" without checking any boxes, Americart will still know the path to your account.

Example two uses an op variable. Notice that although the quantity field of the individual product contains "op1", the actual input type=text size=2 name=op1_rye value="0" uses op1_rye. The "rye" matches the suffix of the "item_rye". Perhaps we've belabored this point, but it is the only real difference between single and multiple item submission besides the fact the all items in a "multi" must be inside a single form /form.

Reminder: DO NOT put "op1_same-unique-as-item" inside the item string quantity field, just op1. name=item_rye value="s-8882^rye^loaf of Rye^2.22^op1" See? Just plain "op1" in the quantity field.

There are many ways to structure this method. The above are just two. You can have select pop-ups, text fields, radio buttons, or anything you wish, just like the single item method.


Copyright. All rights reserved. Americart - 2011