Hello!
Går en kurs i php programmering/javascript.
Som projektarbete skall vi bygga en webbutik och jag håller nu på med att försöka få ihop själva köpdelen av den.
Själva kundkorgen skall implementeras med cookies och till detta har vi fått en klass tilldelad oss i en fil jag kallar kaka.js
Själv förstår jag inte riktigt hela klassen då jag är ganska färsk på javascript men det skall ju inte behövas heller. Koden till klassen ser ut så här:
function Kaka(document, name, hours, path, domain, secure) {
this.$document = document;
this.$name = name;
this.$expiration=hours?new Date(new Date().getTime() + hours*36000000):null;
this.$path=path?path:null;
this.$domain=domain?domain:null;
this.$secure=secure?secure:null;
}
Kaka.prototype.store = function() {
var cookieval="";
for(var prop in this) {
if (prop.charAt(0) == '$' || ((typeof this[prop]) == 'function'))
continue;
if(cookieval != "") cookieval+='&';
cookieval += prop + ':' + escape(this[prop]);
}
var cookie = this.$name + '=' + cookieval;
if(this.$expiration) cookie+=';expires='+this.$expiration.toGMTString();
if(this.$path) cookie +='; path='+this.$path;
if(this.$domain) cookie +='; domain='+this.$domain;
if(this.$secure) cookie +='; secure='+this.$secure;
this.$document.cookie=cookie;
}
Kaka.prototype.load = function() {
var allcookies = this.$document.cookie;
if(allcookies == "") return false;
var start = allcookies.indexOf(this.$name + '=');
if(start == -1) return false;
start += this.$name.length+1;
var end = allcookies.indexOf(';', start);
if (end == -1) end = allcookies.length;
var cookieval = allcookies.substring(start, end);
var a = cookieval.split('&');
for(var i=0;i<a.length;i++)
a[i] = a[i].split(':');
for(var i = 0;i<a.length; i++)
this[a[i][0]] = unescape(a[i][1]);
return true;
}
Kaka.prototype.remove = function() {
var cookie = this.$name+'=';
if(this.$path) cookie += '; path='+this.$path;
if(this.$domain) cookie += '; domain='+this.$domain;
cookie+='; expires=Fri, 02-Jan-1970 00:00:00 GMT';
this.$document.cookie=cookie;
}
Som förslag till hur man kan använda klassen har vi fått följande av vår handledare...
Om klassen ovan skulle användas för att koda personinformationen skulle det så ut så här.
person = new Kaka(document, "person");
person["namn"]="kalle";
person["telefonnummer"]="12345";
person.store();
Vill vi istället hämta värdet från kakan skulle det se ut så här:person = new Kaka(document, "person");
if(person.load())
alert("Hejsan "+person.name);
Och det är väl allt jag behöver veta antar jag...
Så jag gjorde en testsida för att kika lite på hur det kunde tänkas lösas. Detta är mitt förslag...
<html>
<head>
<title>Fredriks WebShop - Produktlista</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="../style.css" rel="stylesheet" type="text/css">
<!-- Här kommer javascriptet som lägger till varorna i cookiesen -->
<script language="JavaScript1.2" type="text/JavaScript1.2" src="kaka.js">
function AddItem(obj)
{
var antal=obj.value;
varukorg["vara"]=antal; //stopar in antalet på platsen med varunamnet
varukorg.store(); //antar att denna sparar värdet i kakan
}
varukorg = new Kaka(document, "varukorg", 12); //skapar ny kaka
varukorg.load(); //laddar in värden från gammal kaka
</script>
</head>
<body>
<p align="center"><font color="#0000FF" size="5">Produktlista</font></p>
<p align="center">Nedan visas en lista med alla produkter som går att köpa
i Fredriks Webbshop!</p>
<hr align="center" width="70%"></p>
<table width="704" border="0" align="center" cellpadding="2" cellspacing="2" bordercolor="#FFFFFF" bgcolor="#FFFFFF">
<tr bgcolor="#CCCCCC">
<td width="68" bgcolor="#999999"><font color="#000000">Produkt id</font></td>
<td width="173" bgcolor="#999999"><font color="#000000">Vara</font></td>
<td width="243" bgcolor="#999999"><font color="#000000">Beskrivning</font></td>
<td width="64" bgcolor="#999999">Pris/st</td>
<td width="62" bgcolor="#999999">Antal</td>
<td width="56" bgcolor="#999999">Köp</td>
</tr>
<!-- här börjar formuläret som krävs för köp knappen och för antalfältet -->
<form action="/users/fskfr02/kund/produkter.php" method="POST" name="kop">
<TR bgcolor=#FFFFFF><TD>3</TD>
<TD>Apelsiner</TD>
<TD>Gula runda frukter</TD>
<TD>2.00</TD>
<TD><input name='antal0' type='text' size='4' maxlength='4' class='formFields'></TD>
<TD><input name='kop0' type='submit' onclick='AddItem(document.kop.antal0);' value='Köp' class='formButtons'>
</TR>
<TR bgcolor=#CCCCCC><TD>5</TD>
<TD>Druvor (Blå)</TD>
<TD>Söta druvor med druvsmak</TD>
<TD>2.00</TD>
<TD><input name='antal1' type='text' size='4' maxlength='4' class='formFields'></TD>
<TD><input name='kop1' type='submit' onclick='AddItem(document.kop.antal1);' value='Köp' class='formButtons'>
</TR>
<TR bgcolor=#FFFFFF><TD>4</TD>
<TD>Druvor (Gröna)</TD>
<TD>Syrliga druvor med druvsmak</TD>
<TD>1.00</TD>
<TD><input name='antal2' type='text' size='4' maxlength='4' class='formFields'></TD>
<TD><input name='kop2' type='submit' onclick='AddItem(document.kop.antal2);' value='Köp' class='formButtons'>
</TR>
<TR bgcolor=#CCCCCC><TD>6</TD>
<TD>Kiwi</TD>
<TD>Grön och luden. Mycket nyttig.</TD>
<TD>2.00</TD>
<TD><input name='antal3' type='text' size='4' maxlength='4' class='formFields'></TD>
<TD><input name='kop3' type='submit' onclick='AddItem(document.kop.antal3);' value='Köp' class='formButtons'>
</TR>
<TR bgcolor=#FFFFFF><TD>2</TD>
<TD>Äpplen</TD>
<TD>Smakar som Äpplen</TD>
<TD>1.00</TD>
<TD><input name='antal4' type='text' size='4' maxlength='4' class='formFields'></TD>
<TD><input name='kop4' type='submit' onclick='AddItem(document.kop.antal4);' value='Köp' class='formButtons'>
</TR>
</form>
</table>
<p align="center"> </p>
<hr width="70%">
<p align="center"><a href="index.htm">Meny</a> | <a href="kunduppgifter.php">Kunduppgifter</a>
| <a href="kassan.htm">Kassa</a></p>
</body>
</html>
Men serru detta fungerar inte. För det första så antar jag att det borde skapas en coockie med namnet varukorg direkt när sidan laddas. Så är inte fallet. Å andra sidan får jag inga felmeddelanden heller när jag klickar på någon av knapparna för att köpa en vara...
Vad gör jag för tokigt nu då???
OBS inlämning på Torsdag!!!!!!
:stud