# Upgrading a shopping cart

**URL:** <https://forum.kirupa.com/t/upgrading-a-shopping-cart/260688>\
**Category:** Uncategorized\
**Created:** [May 18, 2008, 11:30pm UTC](https://forum.kirupa.com/t/upgrading-a-shopping-cart/260688 "2008-05-18T23:30:18Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![bloodyscript](https://avatars.discourse-cdn.com/v4/letter/b/c57346/32.png) [@bloodyscript](https://forum.kirupa.com/u/bloodyscript)\
**Post date:** [May 18, 2008, 11:30pm UTC](https://forum.kirupa.com/t/upgrading-a-shopping-cart/260688/1 "2008-05-18T23:30:18Z")

</div>

hi i have a basic shopping cart already made and was wondering how i could possibly make it a drag and drop shopping cart to make things easier? oh ya the cart i have no is written in php.

---

<div class="post-metadata">

**Author:** ![actionAction](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/actionaction/32/3987_2.png) [@actionAction](https://forum.kirupa.com/u/actionAction)\
**Post date:** [May 19, 2008, 1:33am UTC](https://forum.kirupa.com/t/upgrading-a-shopping-cart/260688/2 "2008-05-19T01:33:02Z")

</div>

Click the Drag & Drop link on the bottom: [http://www.ajax.org/](http://www.ajax.org/)

---

<div class="post-metadata">

**Author:** ![bloodyscript](https://avatars.discourse-cdn.com/v4/letter/b/c57346/32.png) [@bloodyscript](https://forum.kirupa.com/u/bloodyscript)\
**Post date:** [May 19, 2008, 3:57pm UTC](https://forum.kirupa.com/t/upgrading-a-shopping-cart/260688/3 "2008-05-19T15:57:43Z")

</div>

thanx for the link but i started useing the “[Scipt.aculo.us](http://Scipt.aculo.us) JavaScript library” and trying to follow the tutorial on this site “[http://br.sys-con.com/read/172585\_1.htm](http://br.sys-con.com/read/172585_1.htm)” i started it rather than doing it from a blank slate im implementing it in to my site just to see if i can get it to work. i got the draggable to work i can drag a picture anywere and go it to revert back inless it goes into a droppable zone. my shopping cart area is were the droppable is. now the site tells me to add this

[COLOR=Red]function body\_onLoad() {  
// create an SRS gateway to the cart.cfm page  
objGateway = new gateway(“srs/cart.cfm?”);  
// update cart in case of return visit  
// code for this function is below  
updateCart();  
}[/COLOR]

now this is the point that i cant get past anything i do dosnt work. this is my pages code right now

[COLOR=Red]\<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01//EN”\>  
\<title\>MrAmerican.us\</title\>  
\<link rel=“stylesheet” href=“tshirtstyleone.css”\>  
\<head\>\<script src="./scriptaculous-js-1.8.1/lib/prototype.js" type=“text/javascript”\>\</script\>  
\<script src="./scriptaculous-js-1.8.1/src/scriptaculous.js" type=“text/javascript”\>\</script\>\</head\>  
\<style type=“text/css”\>  
\<!–  
.style1 {  
font-family: Arial, Helvetica, sans-serif;  
font-size: 12px;  
}  
.style2 {  
font-family: “Courier New”, Courier, monospace;  
color: #990000;  
font-size: 36px;  
}  
.style3 {  
font-family: “Courier New”, Courier, monospace;  
font-size: 18;  
}  
.style5 {  
font-family: “Courier New”, Courier, monospace;  
font-size: 20px;  
font-weight: bold;  
color: #FFFFFF;  
}  
.style6 {  
font-size: 18px;  
color: #0066FF;  
font-family: “Courier New”, Courier, monospace;  
font-weight: bold;  
}  
.style8 {  
color: #000000;  
font-size: 20px;  
font-weight: bold;  
font-family: “Courier New”, Courier, monospace;  
}  
–\>  
\</style\>  
\<body\>

\<!-- Site navigation menu --\>  
\<ul class=“navbar”\>  
\<li\>\<a href=“index.html”\>Home page\</a\>\</li\>\<li\>\<a href=“events.html”\>events \</a\>\</li\>\<li\>\<a href=“shirts.html”\> Information\</a\>\</li\>\<li\>\<a href=“links.html”\> Links\</a\>\</li\>  
\</ul\>

\<!-- Main content --\>  
\<div class=“container”\>  
\<h1 class=“style2”\>MrAmerican.us\</h1\>  
\<p class=“style5”\>Take Pride In Your Ride!!! Ride American!!!\</p\>  
\<p class=“style6”\>Our Merchandise:\</p\>  
\</div\>  
\<div class=“container2”\>\<img src=“toxict.jpg” width=“116” height=“123” longdesc=“armydeathspadet.jpg” id=“drag\_me”\>\</div\>  
\<script type=“text/javascript”\>  
new Draggable(‘drag\_me’, { revert: true, snap: [40, 40] });  
\</script\>  
\<div class=“shoppingcart” id=“shoppingcart”\>  
\<fieldset style=“width:400px;”\>  
\<legend\>\<span class=“style8”\>Your shopping cart\</span\>\</legend\>  
\<table width=“230” height=“419” border=“0” cellpadding=“5” cellspacing=“0” id=“tableCart”\>  
\<thead\>\</thead\>\<tbody\>\<td width=“220” height=“419”\>\</tbody\>\</table\>  
\<button onclick=“emptyCartButton\_onClick()” id=“emptyCartButton”\>  
Clear Shopping Cart\</button\>  
\</fieldset\>  
\</div\>

\<script type=“text/javascript”\>  
Droppables.add(‘shoppingcart’,{ onDrop:function(element) {  
alert(‘Added UPC ’ + element.id + ’ to your shopping cart.’);  
Element.hide(element.id);}})  
\</script\>  
[/COLOR][COLOR=Red] \<!-- Sign and date the page, it’s only polite! --\>[/COLOR]  
[COLOR=Red]\<div align=“center” class=“style3”\>  
\<address class=“container1 style1”\>  
made may 8 2008 by tobin carroll  
\</address\>  
\</div\>

\</body\>

\</html\>  
[COLOR=Black]  
im not sure as to were to put that function call or any of the others the site talks about its my first site im designing [/COLOR]  
[/COLOR]
