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:
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...
<script language="JavaScript1.2" type="text/JavaScript1.2" src="kaka.js">
<script language="JavaScript1.2" type="text/JavaScript1.2">
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>
Jo... testat det med men det fungerar inte heller...
Börjar misstänka att det är något fel på själva anropet till funktionen för nu får jag ett scriptfel på den raden när jag klickar på knappen.
Jag tror du missat av Solbulle syftar på. Du kan inte inkludera script i samma script-block som du sedan lägger kod i, utan du får lägga det i varsitt script-block som Solbulle gjort. Annars kommer koden som ligger i script-blocket att ignoreras och funktionen AddItem() kommer aldrig att definieras.
Här har php-kod slunkit med ('kop$i'). Hänvisa gärna till den kod som verkligen kommer fram till webbläsaren. Annars händer det gärna att man försöker hitta fel som egentligen ligger i php-koden och alltså inte har med JavaScriptet att göra.
Dokumenttypen type="text/JavaScript1.2" känns lite avigt på samma sätt som du inte sätter med versionsnummer när du definierar en stilmall med elementet <style> (type="text/css2")
Dokumenttypen type="text/JavaScript1.2" känns lite avigt på samma sätt som du inte sätter med versionsnummer när du definierar en stilmall med elementet <style> (type="text/css2")
Åter igen. Du kan INTE lägga in script-kod i samma script-block som du använder för att inkludera script. Denna kod kommer att ignoreras, d.v.s. ditt objekt kommer aldrig att definieras.
Alltså, finns attributet src="something.js" med i <script>-elementet så kan du inte lägga in javascript-kod i detta block utan får skapa ett nytt.
Detta verkar inte heller helt rätt. I detta exempel borde du bara kunna lagra 1 vara i varukorgen vid namn "vara". "vara" borde alltså vara en variabel (parameter som skickas med till funktionen) med namn eller id på artikeln som skall läggas i korgen.
Detta verkar inte heller helt rätt. I detta exempel borde du bara kunna lagra 1 vara i varukorgen vid namn "vara". "vara" borde alltså vara en variabel (parameter som skickas med till funktionen) med namn eller id på artikeln som skall läggas i korgen.
Joru det är helt rätt... ville bara testa lite... vill först se en coockie ;-)
Sorry, såg att Solbulle slarvat lite och missat att </script> :)
<script language="JavaScript1.2" type="text/JavaScript1.2" src="kaka.js"></script>
<script language="JavaScript1.2" type="text/JavaScript1.2">
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>
Hur webbläsaren väljer att spara cookies på användarens dator har du ingen aning om, och det är inte meningen heller. Du läser bara från document.cookie och webbläsaren talar då om vad som finns där.
När jag kör din kod (fast jag bytt ut submit-knappen mot en button eftersom jag inte har de kringliggande php-filerna) så sätts kakan och går att läsa från document.cookie.