views:

30

answers:

0

Hey guys need some help in adding a view cart button but I'm stuck not sure how to code it. any help?

The way I have coded it is that when a user clicks 'add item' they will get a alert box with info about the total price but I want that to appear in the HTML file but only once I have clicked on 'view cart' and I need it to be in a table format with info about the name, sum, price of the items and total. any ideas how I can do this?

here is my javascript

var f,d,str,items,qnts,price,bag,total; 

function cart(){ f=document.forms[0];   
d=f.getElementsByTagName('div'); var      items=[];var qnts=[];price=[];bag=[]
for(i=0,e=0;i<d.length;i++){    
                items[i]=d[i].getElementsByTagName('b')[0].innerHTML;
                qnts[i]=d[i].getElementsByTagName('select')[0].value;
                str=d[i].getElementsByTagName('p')[1].innerHTML;
                priceStart(str,i);  
if(qnts[i]!=0){bag.push(new Array());   ib=bag[bag.length-1];
ib.push(items[i]);ib.push(qnts[i]);ib.push(price[i]);ib.push(qnts[i]*price[i]);}
}
if(bag.length>0){
total=bag[0][3]; if(bag.length>1){for(t=1;t<bag.length;t++){total+=bag[t][3]}}
alert(bag.join('\n')+'\n----------------\ntotal='+total)
}
}
function priceStart(str,inx){for(j=0;j<str.length;j++){if(str.charAt(j)!=' ' &&         !isNaN(str.charAt(j))){priceEnd(j,str,inx);return }}}
function priceEnd(j,str,inx){for(k=str.length;k>j;k--){if(str.charAt(k)!=' ' &&     !isNaN(str.charAt(k))){price[inx]=str.substring(j,k);return }}}

and my HTML

<script type="text/javascript" src="cart.js" />
</script>
<link rel="stylesheet" type="text/css" href="shopping_cart.css" />
<title> A title </title>
</head>
<body>
<form name="form1" method="post" action="data.php" >
<div id="product1">     
<p id="title1"><b>Star Wars Tie Interceptor</b></p>
<img src="images/DS.jpg" /> <p id="price1">Price £39.99</p> <p><b>Qty</b></p>
<select name="qty">
 <option value="0">0</option>
 <option value="1">1</option>
 <option value="2">2</option>
 <option value="3">3</option>
 <option value="4">4</option>
 <option value="5">5</option>
 </select> <input type="button" value="Add to cart" onclick="cart()" />
 </div>