Creating a Multi-Item Form

Adding The Qty Field

Since we'll be adding multiple items with a single button we don't want Cart32 to assume a quantity of 1 for each item. We instead need to offer a textbox or dropdown for the customer to be able to select how many of each item on the multi-item form they'd like. Let's modify our example above to include a quantity field:

Adding a Second Item To The Form

Now that we have a regular product form, we can add the fields to add our second product. We are going to make two modifications to the example for clarity and functionality.

First, we're going to add an HTML comment between the products to help keep them separate. This will take a few seconds, but could save you an hour of debugging the form later if there is a typo. Here is how we add HTML comments to separate the products:

Now that we have comments to separate our two products we can fill out the information for the second item (our hat). To make things easy Cart32 simply uses the same field names as the first item in our multi-item form. This often confuses people because they don't know how Cart32 can tell what's what in the form. The answer is relatively simple: When you pass multiple fields with the same name they simply get posted as a comma-separated list. So Cart32 just splits them up and adds each item individually from the comma-separated list. Here is how we add the fields with the same names for our second product (a hat for $8.49):

Note: We still only have 1 input of type submit. You can have more submit (buy now) buttons if you want, but only one is required

Congratulations! You just created a multi-item form. If you have more products you just follow the same steps as we did for adding a second product for each.

Special Note: The inputs are sent to Cart32 in a comma-separated list, as mentioned above. They are put in order as they appear in the form! For this reason you MUST keep your inputs for each product grouped together. If the input for price for your 2nd product comes before the price input for your 1st product in your form, then the price for the 2nd product will be used instead of the price for the 1st product and vice-versa.

Important Information about Multi-Item Form Options

We will assume you know how to add product options to a single product. If you do not, please read the articles named Product Options - Custom and Product Options - Standard. In the following examples we will be adding a standard option and then a custom option. The most important thing to note about options on multi-item forms is this: The options for any item in a multi-item form MUST exist for all items in the form. For example: if you have 3 products in your form and one of them has an option for weight, then you must put a weight option on the other 2 products. If you don’t, Cart32 has no idea which product the weight option belongs to (remember, all information is sent in comma-separated lists).

Adding a Standard Product Option

Let’s modify our basic multi-item form above to have a weight for each product. The T-Shirt will weight 2 pounds and the Hat will weight 0.7 pounds:

Adding a Custom Product Option

Now we will modify our multi-item form with a custom product option instead of a standard option. Luckily for us, it is very nearly the same thing. In the following example we will give the T-Shirt and Hat the option of a color. We will allow the customer to choose red, green, or blue from the dropdown for each product:

Note: The option choices (red, green blue) do not have to be the same between products. You simply need to make sure the P# and T# fields are there for all products.)

Adding a Custom Product Option with Different Values

Let’s say (using our example) that we wanted the T-Shirt to have a size option and the Hat should have a color option. We will still use P# and T# fields in order. Let’s use the example we just made above and modify the T-Shirt section to have a size dropdown instead of a color option (we’ll leave the Hat’s option alone because it’s staying a color option). To help fill out the example, we’ll also make it so that ordering a Large shirt adds $2.00 to the price of the shirt. Here’s how it would look:

Adding Custom Product Options when Products have Different Numbers of Options

Typically multi-item forms have products that are all very similar and the options are either non-existent or similar in nature. However, some multi-item forms need each product to have a unique set of options. An example might be a starter kit for a training outfit. We will now create an example form with our T-Shirt and Hat, but they will have different numbers of options.

This sounds confusing, but the logic is very simple: make sure any fields you add exist in all products inside the form. We are going to give the T-Shirt the option of Size and Color and again, large size will increase the price by $2.00. We will give the Hat an option of Color only. To accomplish this (using the form directly above that we just made) we will add the dropdown list for Color to the T-Shirt form and then add a blank set of P# and T# fields for the hat (again, this is done to make sure each product has the same inputs and attributes when added to Cart32). Here is how it would look: