Hi have created a shopping cart through a number of examples using php and ajax.
This cart allows me to drag an item into the cart and then the cart updates displaying that items class name.
I have never done any php before so am having trouble adding to this.
I want to add to the script an if statement that would say for example
if(id="item1")
{
price=20
}
else
if{(id="item2")
{
price=15
}
etc etc
I hope you can understand what i mean.
Would be extremely gratefull if someone could help me with how to write this within my script.
html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Untitled Page</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="stylesheet/design.css" type="text/css">
<script type="text/javascript" src="javascript/effect.js"></script>
<script type="text/javascript" src="javascript/prototype.js"></script>
<script type="text/javascript" src="javascript/src/scriptaculous.js?load=effects,dragdrop"></script>
<link rel="stylesheet" href="StyleSheet.css" type="text/css" media="screen" />
<script language="JavaScript" type="text/javascript" src="Javascript/JScript.js"></script>
</head>
<body>
<div id="wrapper">
<div id="bordertop">
</div>
<div id="bordermiddle">
<div id="header" style=" position: relative; left: 3.5%; bottom: 20px; width: 96.5%; height: 200px;">
</div>
<div id="menu" style="position: relative; left: 3%; bottom: 20px; width: 96.5%">
<a href ="http://www.google.com"><img src="images/images/home_btn.png" border="0" alt="Home"/></a><a href ="javascript:artists();"><img src="images/images/artists_btn.png" border="0" alt="Artists" /></a><a href ="index2.php"><img src="images/images/shop_btn.png" border="0" alt="Shop" /></a><a href ="javascript:accordion();"><img src="images/images/events_btn.png" border="0" alt="Events" /></a><a href ="/mp3/mp3player.swf" onclick="loadSWF(this.href); return false;"><img src="images/images/listen_btn.png" border="0" alt="Listen" /></a><a href ="http://www.google.com"><img src="images/images/contact_btn.png" border="0" alt="Contact" /></a>
</div>
<div id="content" style="position:relative; left:3%;">
<div class="item" id="WaxhedsCd">
<img id="item1" src="images/img.jpg">
</div>
<div class="item" id="KoasteCd">
<img src="images/koastecd.jpg">
</div>
<div class="item" id="WaxhedsTee">
<img src="images/waxtee.png">
</div>
<div class="item" id="SmashingCap">
<img src="images/smashcap.png">
</div>
<div class="item" id="WaxCup">
<img src="images/waxcup.png">
</div>
<div class="item" id="SmashingPillow">
<img src="images/smashpillow.png">
</div>
<div class="item" id="OlliePCd">
<img src="images/olliecd.png">
</div>
<div class="cart">
<img id="cart_img" src="images/cart.gif" style="float:left"> <label id="titles">Drag your items here...</label>
<div id="split_line"></div>
<div id="items" style="width:215;height:200">
</div>
</div>
</div>
</div>
<div id="borderbottom">
</div>
</div>
</body>
<script>
makeDraggableItems();
</script>
</html>
php
[code=text]
<?php
session_start();
$elements_arr;
$elementID = $_GET['id'];
if(isset($_SESSION['user_id']))
{
$elements_arr = $_SESSION['user_id'];
if(isset($elements_arr[$elementID]))
{
$no_of_items = $elements_arr[$elementID];
$no_of_items = (int)$no_of_items + 1 ;
$elements_arr[$elementID] = $no_of_items ;
}
else
$elements_arr[$elementID] = 1;
$_SESSION['user_id'] = $elements_arr;
}
else
{
$elements_arr[$elementID] = 1;
$_SESSION['user_id'] = $elements_arr;
}
$keys = array_keys($elements_arr);
for($i = 0 ; $i < count($keys) ; $i++)
{
print("<div id='div'".$keys[$i].">");
print(" <img src='images/point.png' style='margin-top:5px;' width=20px height= 20px> ");
print("<label class='ajax_item'>".$keys[$i]." (".$elements_arr[$keys[$i]].")</label> ");
print(" <img src='images/DeleteIcon.gif' class='delete_img' onclick=(removeItem('".$keys[$i]."'));>");
print("<br>");
print("<div id='split_line'></div>");
print("</div>");
}
?>
ajax
var elementID;
var url;
var updatedDIV = "items";
var xmlHttp = false;
function makeDraggableItems()
{
var items = document.getElementsByClassName('item');
for(var i = 0; i < items.length ; i++)
{
new Draggable(items[i].id,{revert: true,ghosting: true});
Droppables.add('items', {accept:'item',onDrop:function (element)
{
elementID = element.id;
url = "add_to_cart.php?id=" + elementID;
makeAJAXRequest();
}});
}
}
If it helps you can also see this example at the following url
http://jibber4568.gigacities.net/index2.php
Many thanks
Jibber4568
