10-Minute E-Commerce Shopping Cart
   

p1 p2 p3
Product #1

Height:  
Quantity:  

Product #2

Height:  
Quantity:  

Product #3

Height:  
Quantity:  

     
"ADD TO CART" CODE --
<div style="width: 800px; height: 130px; background-repeat: no-repeat; background-image: url(http://www.e-commerceadviser.com/images/header.jpg); color: rgb(255, 255, 255); font-size: 16pt; text-align: right; padding-top: 50px;">  <span style="padding-right: 70px;">10-Minute E-Commerce Shopping Cart</span> </div>
<table width="750" cellspacing="1" cellpadding="1" border="0" align="" summary="">
    <tbody>
        <tr>
            <td> </td>
            <td> </td>
            <td>
            <div align="right">
            <form name="_xclick" target="paypal" action="https://www.paypal.com/us/cgi-bin/webscr" method="post">
                <input type="hidden" name="cmd" value="_cart" /> <input type="hidden" name="business" value="me@mybusiness.com" /> <input type="image" border="0" src="https://www.paypal.com/en_US/i/btn/view_cart_new.gif" name="submit" alt="Make payments with PayPal - it's fast, free and secure!" /> <br />
                <input type="hidden" name="display" value="1" />
            </form>
            </div>
            </td>
        </tr>
        <tr>
            <td align="center"><img width="200" height="175" border="0" alt="p1" src="http://www.e-commerceadviser.com/images/prod1.jpg" /></td>
            <td align="center"><img width="200" height="175" border="0" alt="p2" src="http://www.e-commerceadviser.com/images/prod2.jpg" /></td>
            <td align="center"><img width="200" height="175" border="0" alt="p3" src="http://www.e-commerceadviser.com/images/prod3.jpg" /></td>
        </tr>
        <tr>
            <td align="center"><font size="3" face="Tahoma">Product #1<br /> 
                <center>
                    <FORM onSubmit="return false;" action="https://www.paypal.com/cgi-bin/webscr" method="post">
                    <input type="hidden" name="cmd" value="_cart" />
                    <input type="hidden" name="add" value="1" />
                    <input type="hidden" name="business" value="me@mybusiness.com" />
                    <input type="hidden" name="item_name" value="" />
                    <input type="hidden" name="amount" value="" />
                    <input type="hidden" name="currency_code" value="USD" />
                    <input type="hidden" name="lc" value="US" />
                    
                    <input type="hidden" name="baseamt" value="29.00" />
                    <input type="hidden" name="basedes" value="Product #1" />
                    
                    <input type="hidden" name="on0" value="" />
                    <input type="hidden" name="os0" value="" />
                    <input type="hidden" name="on1" value="" />
                    <input type="hidden" name="os1" value="" />
                    <input type="hidden" name="item_number" value="" />
                    
                    <input type="hidden" name="baseon0" value="" />
                    <input type="hidden" name="baseos0" value="" />
                    <input type="hidden" name="baseon1" value="" />
                    <input type="hidden" name="baseos1" value="" />
                    <input type="hidden" name="baseitn" value="" />
                    
                    <br />
                    
                      Height:  
                      <select onchange = "ReadForm (this.form);">
                        <option value="16&quot; @29.00">16&quot; ($29.00)</option>
                        <option value="18&quot; @39.00">18&quot; ($39.00)</option>
                        <option value="20&quot; @49.00">20&quot; ($49.00)</option>
                      </select>
                      <br />
                      Quantity:  
                        <input name="quantity" type="text" class="order-text" value="1" size="4" maxlength="2">
                      <br /><br />
                        <input onclick="SubClear (this.form);" type=image alt="cart add" 
                        src="http://www.paypal.com/en_US/i/btn/x-click-but22.gif" name="submit" alt="cart add" />
                    </form>
				</center>
			</td>
            <td align="center"><font size="3" face="Tahoma">Product #2<br /> 
                <center>
                    <FORM onSubmit="return false;" action="https://www.paypal.com/cgi-bin/webscr" method="post">
                    <input type="hidden" name="cmd" value="_cart" />
                    <input type="hidden" name="add" value="1" />
                    <input type="hidden" name="business" value="me@mybusiness.com" />
                    <input type="hidden" name="item_name" value="" />
                    <input type="hidden" name="amount" value="" />
                    <input type="hidden" name="currency_code" value="USD" />
                    <input type="hidden" name="lc" value="US" />
                    
                    <input type="hidden" name="baseamt" value="29.00" />
                    <input type="hidden" name="basedes" value="Product #2" />
                    
                    <input type="hidden" name="on0" value="" />
                    <input type="hidden" name="os0" value="" />
                    <input type="hidden" name="on1" value="" />
                    <input type="hidden" name="os1" value="" />
                    <input type="hidden" name="item_number" value="" />
                    
                    <input type="hidden" name="baseon0" value="" />
                    <input type="hidden" name="baseos0" value="" />
                    <input type="hidden" name="baseon1" value="" />
                    <input type="hidden" name="baseos1" value="" />
                    <input type="hidden" name="baseitn" value="" />
                    
                    <br />
                    
                      Height:  
                      <select onchange = "ReadForm (this.form);">
                        <option value="16&quot; @29.00">16&quot; ($29.00)</option>
                        <option value="18&quot; @39.00">18&quot; ($39.00)</option>
                        <option value="20&quot; @49.00">20&quot; ($49.00)</option>
                      </select>
                      <br />
                      Quantity:  
                        <input name="quantity" type="text" class="order-text" value="1" size="4" maxlength="2">
                      <br /><br />
                        <input onclick="SubClear (this.form);" type=image alt="cart add" 
                        src="http://www.paypal.com/en_US/i/btn/x-click-but22.gif" name="submit" alt="cart add" />
                      </center>
                    </form>
				</center>
			</td>
            <td align="center"><font size="3" face="Tahoma">Product #3<br /> 
                <center>
                    <FORM onSubmit="return false;" action="https://www.paypal.com/cgi-bin/webscr" method="post">
                    <input type="hidden" name="cmd" value="_cart" />
                    <input type="hidden" name="add" value="1" />
                    <input type="hidden" name="business" value="me@mybusiness.com" />
                    <input type="hidden" name="item_name" value="" />
                    <input type="hidden" name="amount" value="" />
                    <input type="hidden" name="currency_code" value="USD" />

                    <input type="hidden" name="lc" value="US" />
                    
                    <input type="hidden" name="baseamt" value="29.00" />
                    <input type="hidden" name="basedes" value="Product #3" />
                    
                    <input type="hidden" name="on0" value="" />
                    <input type="hidden" name="os0" value="" />
                    <input type="hidden" name="on1" value="" />
                    <input type="hidden" name="os1" value="" />
                    <input type="hidden" name="item_number" value="" />
                    
                    <input type="hidden" name="baseon0" value="" />
                    <input type="hidden" name="baseos0" value="" />
                    <input type="hidden" name="baseon1" value="" />
                    <input type="hidden" name="baseos1" value="" />
                    <input type="hidden" name="baseitn" value="" />
                    
                    <br />
                    
                      Height:  
                      <select onchange = "ReadForm (this.form);">
                        <option value="16&quot; @29.00">16&quot; ($29.00)</option>
                        <option value="18&quot; @39.00">18&quot; ($39.00)</option>
                        <option value="20&quot; @49.00">20&quot; ($49.00)</option>
                      </select>
                      <br />
                      Quantity:  
                        <input name="quantity" type="text" class="order-text" value="1" size="4" maxlength="2">
                      <br /><br />
                        <input onclick="SubClear (this.form);" type=image alt="cart add" 
                        src="http://www.paypal.com/en_US/i/btn/x-click-but22.gif" name="submit" alt="cart add" />
                    </form>
				</center>
			</td>
        </tr>
        <tr>
          <td align="center"> </td>
          <td align="center"> </td>
          <td align="center"> </td>
        </tr>
    </tbody>
</table>


PROCESSING CODE --

<SCRIPT type=text/javascript>
<!--
function Dollar (val) {  // force to valid dollar amount
var str,pos,rnd=0;
  if (val < .995) rnd = 1;  // for old Netscape browsers
  str = escape (val*1.0 + 0.005001 + rnd);  // float, round, escape
  pos = str.indexOf (".");
  if (pos > 0) str = str.substring (rnd, pos + 3);
  return str;
}

function ReadForm (obj1, tst) { // Read the user form
var i,j,amt,des,obj,pos,val,op1a="",op1b="",op2a="",op2b="";
  amt = obj1.baseamt.value*1.0;       // base amount
  des = obj1.basedes.value;           // base description
  if (obj1.baseon0) op1a = obj1.baseon0.value;  // base options
  if (obj1.baseos0) op1b = obj1.baseos0.value;
  if (obj1.baseon1) op2a = obj1.baseon1.value;
  if (obj1.baseos1) op2b = obj1.baseos1.value;
  for (i=0; i<obj1.length; i++) {     // run entire form
    obj = obj1.elements[i];           // a form element
    if (obj.type == "select-one" &&   // just selects
        obj.name == "") {             // must be un-named
      pos = obj.selectedIndex;        // which option selected
      val = obj.options[pos].value;   // selected value
      pos  = val.indexOf ("@");       // price set?
      if (pos >= 0) amt = val.substring (pos + 1)*1.0;
      pos  = val.indexOf ("+");       // price increment?
      if (pos >= 0) amt = amt + val.substring (pos + 1)*1.0;
      pos  = val.indexOf ("%");       // percent change?
      if (pos >= 0) amt = amt + (amt * val.substring (pos + 1)/100.0);
      if (des.length == 0) des = val; 
      else des = des + ", " + val;    // accumulate value
    } else
    if (obj.type == "checkbox" ||     // just get checkboxex
        obj.type == "radio") {        //  and radios
      if (obj.checked) {
        val = obj.value;              // the value of the selection
        pos  = val.indexOf ("@");     // price set?
        if (pos >= 0) amt = val.substring (pos + 1)*1.0;
        pos  = val.indexOf ("+");     // price increment?
        if (pos >= 0) amt = amt + val.substring (pos + 1)*1.0;
        pos  = val.indexOf ("%");     // percent change?
        if (pos >= 0) amt = amt + (amt * val.substring (pos + 1)/100.0);
        if (des.length == 0) des = val;
        else des = des + ", " + val;  // accumulate value, or text
      }
    } else
    if (obj.type == "select-multiple") {  //one or more
      for (j=0; j<obj.options.length; j++) {  // run all options
        if (obj.options[j].selected) {
          val = obj.options[j].value; // selected value (default)
          if (des.length = 0) des = amt;
          else des = des + ", " + val;// accumulate value, or text
          pos  = val.indexOf ("+");   // price increment?
          if (pos >= 0) amt = amt + val.substring (pos + 1)*1.0;
        }
      }
    } else
    if (obj.type == "text" &&         // just read text,
        obj.name != "tot" &&          //  but not from here
        obj.name != "quantity") {
      val = obj.value;                // get the data
      if (val == "" && tst) {         // force an entry
        alert ("Enter data for " + obj.name);
        return false;
      }
      tag = obj.name.substring (0, 2);  // get special flag
      if      (tag == "1a") op1a = op1a + " " + val;
      else if (tag == "1b") op1b = op1b + " " + val;
      else if (tag == "2a") op2a = op2a + " " + val;
      else if (tag == "2b") op2b = op2b + " " + val;
      else if (des.length == 0) des = val;
      else des = des + ", " + val;
    }
  }
// Now summarize stuff we just processed, above
  if (op1a.length > 0) obj1.on0.value = op1a;
  if (op1b.length > 0) obj1.os0.value = op1b;
  if (op2a.length > 0) obj1.on1.value = op2a;
  if (op2b.length > 0) obj1.os1.value = op2b;
  obj1.item_name.value = des;
  obj1.amount.value = Dollar (amt);
  if (obj1.tot) obj1.tot.value = "$" + Dollar (amt);
  return true;
}

function SubClear (obj1) {  // submit, then clear a FORM
  if (ReadForm(obj1,true)) {
    obj1.target = 'paypal';
    obj1.submit();
    obj1.reset();
  }
  return false;
}


//-->
</SCRIPT>