Intergrating database information into html code

Hi Sam,

I've been trying to add the following to my product description, however I am unable to figure out how to do it. The code is from my existing web site, which I did not create.

My intention is to let my customers pick a width, a color and a size.
Additionally, when useing this code I have to enter the Product and the Price for each individual item. Is there a way to put this code in my data base and have the Product Description and price be entered automatically from the database?

Thanks - Frank


<FORM METHOD="POST" ACTION="http://ww7.aitsafe.com/cf/add.cfm">
<INPUT TYPE="HIDDEN" NAME="userid" VALUE="9137084">
<INPUT TYPE="HIDDEN" NAME="price" VALUE="">

<INPUT TYPE="HIDDEN" NAME="product[]" VALUE="">
<select name="productpr">
<option value="Conchos-19, Width 1.50:45.00"> Width 1.50 </option>
<option value="Conchos-19, Width 1.75:47.00"> Width 1.75 </option>
</select>&nbsp;

<select name="product[]">
<option value="Color Black"> Black </option>
<option value="Color Brown"> Brown </option>
<option value="Color Natural"> Natural </option>
<option value="Color Other"> Other </option>
</select>&nbsp;

<select name="product[]">
<option value="Size 24"> Size 24</option>
<option value="Size 26"> Size 26</option>
<option value="Size 28"> Size 28</option>
<option value="Size 30"> Size 30</option>
<option value="Size 32"> Size 32</option>
<option value="Size 34"> Size 34</option>
<option value="Size 36"> Size 36</option>
<option value="Size 38"> Size 38</option>
<option value="Size 40"> Size 40</option>
<option value="Size 42"> Size 42</option>
<option value="Size 44"> Size 44</option>
</select>

<p>
<INPUT TYPE="submit" value="Buy Now"> </p>
</FORM>
</td>
             </tr>
           </table>
</td>
               </tr>
               <tr>
                 <td width="100%">&nbsp;</td>
               </tr>
               <tr>
                 <td width="100%">&nbsp;</td>
               </tr>
             </table>
     <p>&nbsp;</p>

 

Intergrating database information into html code

Hi Sam,

I gotta tell you... you are the best. I entered the code as you suggested and am now on my way. With your example I am able to add lots of other options for my customers to choose from.

I do have one suggestion, though. With the code you sent me there was no option for my customers to "Continue Shopping" - so I finally figured out that I needed to add the following code to have customers to be given the choice to Continue Shopping. Here it is:
<input type="Hidden" name="return" value="www.circlewleather.com">

Sam - Thanks again,
Frank

FrancisJ

Glad to Help

Frank:

By the way, the Shopping Cart itself can contain a "Continue Shopping" button. If your present cart does not display a "Continue Shopping" button, then see if you can globally display this button in your cart via your Mal's account settings at Mal's website. If so, then you don't really need to add additional code.

The "return" code you mentioned above is used to send the customer to a defined URL "after" the transaction has been completed, which in your case is www.circlewleather.com. You can see that this "return" URL feature is also built into the XLEcom program under the Shopping Cart Setup utility.

Also, if you want to use a popup Shopping Cart window, you can use the alternative Add-to-Cart form elements explained in the button image section in the previous post. This way the user can always continue shopping in the main browser window.

By the way, did you download the Multiple Options Add-to-Cart Form Generator Utility?

You can use this Excel utility file to generate any number of HTML Add-to-Cart form code snippets that support up to three (3) drop-down option scroll boxes with each scroll box supporting up to 5 selections. The first of the three scroll boxes can include up to 5 different prices.

Use the file download link provided at the bottom of the previous reply.

Sam Raheb
XLEcom Program Developer

RE: Intergrating database information into html code

Frank:

Here is my response to your inquiry.

Adding a Custom Add-to-Cart Form

The code you posted is the Add-to-Cart form code for Mal's Cart, as shown below. I added the two prices to the first option scroll box so that your customers will see your prices. This two price additions are indicated in red.

    <FORM METHOD="POST" ACTION="http://ww7.aitsafe.com/cf/add.cfm">
    <INPUT TYPE="HIDDEN" NAME="userid" VALUE="9137084">
    <INPUT TYPE="HIDDEN" NAME="price" VALUE="">

    <INPUT TYPE="HIDDEN" NAME="product[]" VALUE="">
    <select name="productpr">
    <option value="Conchos-19, Width 1.50:45.00"> Width 1.50 ($45.00)</option>
    <option value="Conchos-19, Width 1.75:47.00"> Width 1.75 ($47.00)</option>
    </select>&nbsp;

    <select name="product[]">
    <option value="Color Black"> Black </option>
    <option value="Color Brown"> Brown </option>
    <option value="Color Natural"> Natural </option>
    <option value="Color Other"> Other </option>
    </select>&nbsp;

    <select name="product[]">
    <option value="Size 24"> Size 24</option>
    <option value="Size 26"> Size 26</option>
    <option value="Size 28"> Size 28</option>
    <option value="Size 30"> Size 30</option>
    <option value="Size 32"> Size 32</option>
    <option value="Size 34"> Size 34</option>
    <option value="Size 36"> Size 36</option>
    <option value="Size 38"> Size 38</option>
    <option value="Size 40"> Size 40</option>
    <option value="Size 42"> Size 42</option>
    <option value="Size 44"> Size 44</option>
    </select>

    <p>
    <INPUT TYPE="submit" value="Buy Now"> </p>
    </FORM>

You can use this custom Add-to-Cart code as a replacement for the Add-to-Cart code that gets automatically generated by the XLEcom program.

Here is how to implement it:
You can implement the following procedure via the Product Design sheet or Database sheet.

(1) First remove all line breaks from your custom Add-to-Cart form code to make a "single line" of code as shown below:

    <FORM METHOD="POST" ACTION="http://ww7.aitsafe.com/cf/add.cfm"><INPUT TYPE="HIDDEN" NAME="userid" VALUE="9137084"><INPUT TYPE="HIDDEN" NAME="price" VALUE=""><INPUT TYPE="HIDDEN" NAME="product[]" VALUE=""><select name="productpr"><option value="Conchos-19, Width 1.50:45.00"> Width 1.50 ($45.00)</option><option value="Conchos-19, Width 1.75:47.00"> Width 1.75 ($47.00)</option></select>&nbsp;<select name="product[]"><option value="Color Black"> Black </option><option value="Color Brown"> Brown </option><option value="Color Natural"> Natural </option><option value="Color Other"> Other </option></select>&nbsp; <select name="product[]"><option value="Size 24"> Size 24</option><option value="Size 26"> Size 26</option><option value="Size 28"> Size 28</option><option value="Size 30"> Size 30</option><option value="Size 32"> Size 32</option><option value="Size 34"> Size 34</option><option value="Size 36"> Size 36</option><option value="Size 38"> Size 38</option><option value="Size 40"> Size 40</option><option value="Size 42"> Size 42</option><option value="Size 44"> Size 44</option></select> <p><INPUT TYPE="submit" value="Buy Now"> </p></FORM>

(2) Next, Add a <br><br> to the end of the "Item Description (Optional)" and then place this single line of code after the <br><br>. Note: the <br><br> is an HTML double line break carriage return.

For Example, if your "Item Description (Optional)" was originally:

    <b>Description:</b><br>Introducing the next generation of UltraPro™ Series Flat Panel LCDs from ABCO. ABCO 15" 15TTFB Black Flat Panel LCD Monitor.<br><br>The ABCO UltraPro™ offers bright crisp color resolutions and distortion free images with a fast refresh rate.<br><br>Compliant Standards - UL, CSA, DHHS, FCC-B, MPR-II, NUTEK, ISO 9241, EPA Energy Star<br><br><b>Specifications:</b><br>• Model #15TTFB<br>• Native Resolution: 1024 x 768<br>• 0.24mm Pixel Pitch horizontal<br>• 0.14mm Pixel Pitch vertical<br>• 3-Year Manufacturer Warranty

Then the new "Item Description (Optional)" will look like the following with the included Add-to-Cart form code:

    <b>Description:</b><br>Introducing the next generation of UltraPro™ Series Flat Panel LCDs from ABCO. ABCO 15" 15TTFB Black Flat Panel LCD Monitor.<br><br>The ABCO UltraPro™ offers bright crisp color resolutions and distortion free images with a fast refresh rate.<br><br>Compliant Standards - UL, CSA, DHHS, FCC-B, MPR-II, NUTEK, ISO 9241, EPA Energy Star<br><br><b>Specifications:</b><br>• Model #15TTFB<br>• Native Resolution: 1024 x 768<br>• 0.24mm Pixel Pitch horizontal<br>• 0.14mm Pixel Pitch vertical<br>• 3-Year Manufacturer Warranty<br><br><FORM METHOD="POST" ACTION="http://ww7.aitsafe.com/cf/add.cfm"><INPUT TYPE="HIDDEN" NAME="userid" VALUE="9137084"><INPUT TYPE="HIDDEN" NAME="price" VALUE=""><INPUT TYPE="HIDDEN" NAME="product[]" VALUE=""><select name="productpr"><option value="Conchos-19, Width 1.50:45.00"> Width 1.50 ($45.00)</option><option value="Conchos-19, Width 1.75:47.00"> Width 1.75 ($47.00)</option></select>&nbsp;<select name="product[]"><option value="Color Black"> Black </option><option value="Color Brown"> Brown </option><option value="Color Natural"> Natural </option><option value="Color Other"> Other </option></select>&nbsp; <select name="product[]"><option value="Size 24"> Size 24</option><option value="Size 26"> Size 26</option><option value="Size 28"> Size 28</option><option value="Size 30"> Size 30</option><option value="Size 32"> Size 32</option><option value="Size 34"> Size 34</option><option value="Size 36"> Size 36</option><option value="Size 38"> Size 38</option><option value="Size 40"> Size 40</option><option value="Size 42"> Size 42</option><option value="Size 44"> Size 44</option></select> <p><INPUT TYPE="submit" value="Buy Now"> </p></FORM>

(3) Remove all the options for "this particular Product Ad" in the five Database user fields, User 1 through User 5. These five cells should remain empty.

(4) Via the Database sheet, change the "Display Add to Cart" field from TRUE to FALSE. If using the Product Design form, uncheck the Add-to-Cart Check box. This way the program will not automatically generate an Add-to-Cart button for this particular Product Ad.

If you want to use the Add-to-Cart image button instead of the standard form button, then replace both the following Form and submit button code with the code shown below:

    <FORM METHOD="POST" ACTION="http://ww7.aitsafe.com/cf/add.cfm">

    <form action="http://ww7.aitsafe.com/cf/add.cfm" method="post" target="shopcart">

    and

    <INPUT TYPE="submit" value="Buy Now">

    <input type="image" name="submit" src="../images/add-to-cart-01.gif" border="0" alt="Add to Cart" OnClick="window.open('','shopcart','scrollbars,resizable,status,width=600,height=400')">

The target="shopcart" code in the form tag opens the cart in a popup window

Note The Add-to-Cart image button will only appear when the Product Ad is published and not in the Previews.

Below is what the final published Product Ad will look like when you use this method. The price is determined by the first drop-down scroll box.

    Width 1.50 = $45.00
    Width 1.75 = $47.00

If you want to simply be able to change the prices without having to manually edit the Add-to-Cart form code, then you must create a formula Form function by referencing the prices as a cell links. This procedure is too complicated to explain here, but you may be able to figure this one out for yourself.

Multiple Options Add-to-Cart Form Generator Utility
Use the following Excel utility file to generate any number of HTML Add-to-Cart form code snippets that will support up to three (3) drop-down option scroll boxes with each scroll box supporting up to 5 selections. The first of the three scroll boxes can include up to 5 different prices.

PS. I will also post a modification of this reply as an "Helpful Information" topic titled "Adding a Custom Add-to-Cart Form" so others may utilize this information.

I hope this helps you,


XLEcom Program Developer

Sam Raheb
XLEcom Program Developer