[JS] Klickshop zur freien Benutzung

Startpost-Retter
(kurz für die Suche: Klickshop virtueller shop shopsystem)

Hallo,

Hab da ja öfter gefragt wird, einen kleinen Shop in JavaScript und PHP4 geschrieben. Programmierkentnisse werden hier nicht vorausgesetzt. HTML sowie CSS kentnisse sollten zur Anpassung vorhanden sein.

Zu sehen auf:

* Artikel leicht hinzuzufügen
* Zum löschen eines Artikels, Artikel in Liste auswählen
* JavaScript beim Benutzer wird vorrausgesetzt
* Kosten werden automatisch abgeglichen
* Betreiber bekommen Email beim absenden
* leicht erweiterbar

Hier der Code:

code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
 
<script type="text/javascript">
function newitem(costs,value) {
	newelement = new Option(value,value+"|"+costs);
	document.getElementsByName("items[]")[0].options[document.getElementsByName("items[]")[0].length] = newelement;
	document.getElementById("costs").innerHTML = parseInt(document.getElementById("costs").firstChild.data) + costs;
}

function removeitem() {
	var item = document.getElementsByName("items[]")[0].value.split("|");
	document.getElementById("costs").innerHTML = parseInt(document.getElementById("costs").firstChild.data) - parseInt(item[1]);
	document.getElementsByName("items[]")[0].options[document.getElementsByName("items[]")[0].selectedIndex] = null;
}

function selectall() {
	for(i = 0; i < document.getElementsByName("items[]")[0].length; i++) {
		document.getElementsByName("items[]")[0].options[i].selected="selected"; 
	}
}
</script>

<form name="shopform" method="post" action="" onsubmit="selectall()">
  <select name="items[]" size="10" onchange="removeitem()" multiple="multiple">
  </select>
  <input type="submit" value="Absenden!">
</form>

Halskette für 120€: <a href="javascript:newitem(120,'halskette');">In den Wagen</a><br />
Fernseher für 2500€: <a href="javascript:newitem(2500,'plasma tv');">In den Wagen</a><br />

<br />____________<br />
Kosten: <span id="costs">0</span>€

<?php

if(!empty($_POST)) {
	$count = array_count_values($_POST['items']);
	$all = 0;
	$mailcontent = "";

	foreach($count AS $item => $lot) {
		$explode = explode("|", $item);
		$mailcontent .= $explode[0]." wurde ". $lot." mal bestellt. Summe: ".($lot*$explode[1])."\n";
		$all += $lot*$explode[1];
	}
	mail("deineemail", "Shop", "Neuer Einkauf:\n\n".$mailcontent."\n\nGesamt: ".$all);
	echo "Danke auch!";
}

?>


Die Email muss angepasst werden. Sonst funktioniert er wie im Beispiel.

Feedback und Kritik erwünscht smile
aschenputtel
script läuft, gute idee, allerdings würde ich das ganze mit der zeit noch grafisch aufpeppen.
Tigerlilly
Ich verschiebs mal nach Tutorials.
anna.
Zitat:
Original von Mordred
Hallo,

Das ganze kann doch jeder mit eigenen "in den Einkaufswagen" - Icons austatten und den "Einkaufswagen" kann auch jeder mit ein wenig CSS Kentniss selbst gestalten. Oder was meinst Du?

vielleicht meinte sie mit einem Layout etc.
Was aber auch ganz einfach in ein I-Frame eingebunden werden kann. Ganz normal und so. XD
die Tini
supi funzt großes Grinsen
skateboard
Genial!
Klappt & sieht gut aus (wenn mans anpasst großes Grinsen )
Danke smile
die Tini
Haben da nochmal ne frage...wir wollten den auf nem vrh verwenden, sind aber irgentwie wissen wir nicht wie man das machen muss, das man noch den namen eingeben kann, von dem, der es geschickt hat...
die Tini
dankeschön <3
Princez
hää ?

ich kapier das nicht... ich bin bei oyla das qeht nicht..

kannst du mir soo was mal für oyla coden wenns qeht ?
Maina
Zitat:
Original von Princez
hää ?

ich kapier das nicht... ich bin bei oyla das qeht nicht..

kannst du mir soo was mal für oyla coden wenns qeht ?


Oyla unterstützt kein PHP.

Lern HTML / besorg dir Frontpage und zieh auf 'nen Webspace um, der PHP unterstützt.
aschenputtel
Zitat:
Original von .anna <3
Zitat:
Original von Mordred
Hallo,

Das ganze kann doch jeder mit eigenen "in den Einkaufswagen" - Icons austatten und den "Einkaufswagen" kann auch jeder mit ein wenig CSS Kentniss selbst gestalten. Oder was meinst Du?

vielleicht meinte sie mit einem Layout etc.
Was aber auch ganz einfach in ein I-Frame eingebunden werden kann. Ganz normal und so. XD


genau^^
*sue
und wie geht das wenn ich noch ein weiteres Feld haben moechte?
also Name und Pferd
??
Ansonsten klasse!!!
ich-bin-ich
Zitat:
Original von pferdetreume
und wie geht das wenn ich noch ein weiteres Feld haben moechte?
also Name und Pferd
??
Ansonsten klasse!!!


würde mich ebenfalls interessieren
*sue
:/
Ich hatte das auch schon probiert, da es ja rein theoretisch sogar fuer MICH logisch war ging aber nicht unglücklich

Es sagt mir immer
code:
1:
Parse error: syntax error, unexpected T_CONSTANT_ENCAPSED_STRING in /users/reitstallpicollo/www/reiterladen/feld.php on line 52


*schnief*

hier mein code
(warscheinlich wieder alles voll falsch gemacht >.<)

code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
<html>
<head>
  <title>Picollo</title>
  <link rel="stylesheet" href="/style.css"
 type="text/css">
</head>
<body>
<table><tbody><tr><td><script type="text/javascript">
function newitem(costs,value) {
	newelement = new Option(value,value+"|"+costs);
	document.getElementsByName("items[]")[0].options[document.getElementsByName("items[]")[0].length] = newelement;
	document.getElementById("costs").innerHTML = parseInt(document.getElementById("costs").firstChild.data) + costs;
}

function removeitem() {
	var item = document.getElementsByName("items[]")[0].value.split("|");
	document.getElementById("costs").innerHTML = parseInt(document.getElementById("costs").firstChild.data) - parseInt(item[1]);
	document.getElementsByName("items[]")[0].options[document.getElementsByName("items[]")[0].selectedIndex] = null;
}

function selectall() {
	for(i = 0; i < document.getElementsByName("items[]")[0].length; i++) {
		document.getElementsByName("items[]")[0].options[i].selected="selected"; 
	}
}
</script>

<form name="shopform" method="post" action="" onsubmit="selectall()">
  <select name="items[]" size="10" onchange="removeitem()" multiple="multiple">
  </select>    <br /></td><td><font size="-1">
  Name: <input style="width:90px;" type="text" name="name" /><br>
 Pferd: <input type="text" name="pferd" /><br>
  &nbsp;
&nbsp; &nbsp; &nbsp; &nbsp;
<input type="submit" value="Absenden!">
</form>
<br />____________<br />
Kosten: <span id="costs">0</span>€

<?php

if(!empty($_POST)) {
	$count = array_count_values($_POST['items']);
	$all = 0;
	$mailcontent = "";

	foreach($count AS $item => $lot) {
		$explode = explode("|", $item);
		$mailcontent .= $explode[0]." wurde ". $lot." mal bestellt. Summe: ".($lot*$explode[1])."\n";
		$all += $lot*$explode[1];
	}
	mail("susi.hauk@web.de", "Shop", "Neuer Einkauf:\n\n".$mailcontent."\n\nGesamt: ".$all."\n\nBestellt wurde von: ".$_POST['name']"\n\nBestellt wurde fuer: ".$_POST['pferd']);
	echo "Danke auch!";
}

?>
</td></tr></tbody></table>
</body></html>


Ich habe es auch mit " hinter dem ".$_POST['pferd'] versucht
also ".$_POST['pferd']"
ging trozdem nicht...
und meine PHP-Kenntnisse sind leider nicht so amazing...
*sue
es hat ein Punkt gefehlt >.<
tausend dank!

es geeeeht großes Grinsen
Tante Lulu
hey, hab ein kleines Problem mit dem Dingel.
Ansich klappt alles bis auf das Senden...

php:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
<?php

if(!empty($_POST)) {
    $count array_count_values($_POST['items']);
    $all 0;
    $mailcontent "";

    foreach($count AS $item => $lot) {
        $explode explode("|"$item);
        $mailcontent .= $explode[0]." wurde "$lot." mal bestellt. Summe: ".($lot*$explode[1])."\n";
        $all += $lot*$explode[1];
    }
    mail("Gestuet-Rotmoor@web.de""Shop""Neuer Einkauf:\n\n".$mailcontent."\n\nGesamt: ".$all);
    echo "Danke auch!";
}

?>
Princez
kann man auch so ein klickshop fuer oyla.de coden ?
Tante Lulu
Hilfe Bitte...
Der Shop klappt bei mir soweit, aer immer wenn ich dann senden will geht das nicht!

Ich weiß nicht woran das liegt, irgentetwas mach ich falsch bei dem gedöns wo auch die e-mail eingetragen werden muss. (Siehe oben, letzter Beitrag von mir)

Sorry, aber ich finde das so toll, das muss einfach gehn, daher brauche ich dringend hilfe!
Tante Lulu
code:
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:
67:
68:
69:
70:
71:
72:
73:
74:
75:
76:
77:
78:
79:
80:
81:
82:
83:
84:
85:
86:
87:
88:
89:
90:
91:
92:
93:
94:
95:
96:
97:
98:
99:
100:
101:
102:
103:
104:
105:
106:
107:
108:
109:
110:
111:
112:
113:
114:
115:
116:
117:
118:
119:
120:
121:
122:
123:
124:
125:
126:
127:
128:
129:
130:
131:
132:
133:
134:
135:
136:
137:
138:
139:
140:
141:
142:
143:
144:
145:
146:
147:
148:
149:
150:
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>Raufutter und Einstreu</title>
<style type="text/css"><!--body{background-attachment:fixed;}--></style>
<style type="text/css">
<!-- A:link, A:active, A:visited {color: #000000, font-size:10pt; text-decoration:none;}
A:hover {color: #000000; font-size:10pt; text-decoration:none; position: relative; top: 1px ; left:1px;}
--> </style>
<style type="text/css">
<!--body{
scrollbar-face-color: #E0E0E0;
scrollbar-highlight-color: #E0E0E0;
scrollbar-3dligjt.color:#A72323;
scrollbar-darkshadow-color: #E0E0E0;
scrollbar-shadow-color:#A72323;
scrollbar-arrow-color: #A72323;
scrollbar-track-color: #E0E0E0;
}
-->
</style>
<meta name="Microsoft Theme" content="rotmoor-futter-b 011, default">
</head>

<body background="_themes/rotmoor-futter-b/futterkammerdesib.gif" bgcolor="#FFFFFF" text="#000000" link="#000000" vlink="#000000" alink="#000000"><!--mstheme--><font face="Verdana">

<p align="center"><b><font size="2">Raufutter und Einstreu</font></b></p>
<blockquote>
  <p align="left"><font size="2">Unser Stroh und auch das Heu kommt von
  ausgewählten Bauern hier aus unserer Nähe. Das&nbsp;<br>
  Raufutter wird sorgfältig angebaut und abgeerntet, uns hat eine besonders
  hohe Qualität.<br>
  Für Staubempfindliche Pferde, oder Allergiker empfehlen wir als Heuersatz
  Luzerne zu füttern.</font></p>
<p><font size="2">&nbsp;&nbsp; <b> Raufutter</b></font></p>
<p><font size="2"><i>Heu</i></font></p>
<p><font size="2">pro Woche</font></p>
<p><font face="Verdana" size="1">Heu 1 Rippe für 21€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(21,'W Heu 1R');">Mein Pferd Füttern</a><br />
Heu 1 ½ Rippe für 24,50€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(24.50,'W Heu 1,5R');">Mein Pferd Füttern</a><br />
Heu 2 Rippen für 28€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(28,'W Heu 2R');">Mein Pferd Füttern</a><br />
Heu 2 ½ Rippen für 31,50€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(31.50,'W Heu 2,5R');">Mein Pferd Füttern<br>
</a></font>
<font size="1">Luzerne 1 Schüppe für 16,10€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(16.10,'W Luzerne 1S');">Mein Pferd Füttern</a>&nbsp;<br>
Luzerne 2 Schüppen für 32,20€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(32.20,'W Luzerne 2S');">Mein Pferd Füttern</a>&nbsp;<br>
Luzerne 3 Schüppen für 48,30€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(48.30,'W Luzerne 3S');">Mein Pferd Füttern</a></font>

</p>
<p><font face="Verdana" size="2">pro Monat</font></p>
<p><font face="Verdana" size="1">
Heu 1 Rippe für 90€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(90,'M Heu 1R');">Mein Pferd Füttern</a><br />
Heu 1 ½ Rippe für 106,50€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(106.50,'M Heu 1,5R');">Mein Pferd Füttern</a><br />
Heu 2 Rippen für 122€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(122,'M Heu 2R');">Mein Pferd Füttern</a><br />
Heu 2 ½ Rippen für 137,50€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(137.50,'M Heu 2,5R');">Mein Pferd Füttern<br>
</a></font>
<font size="1">Luzerne 1 Schüppe für 71,30€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(71.30,'M Luzerne 1S');">Mein Pferd Füttern<br>
</a>Luzerne 2 Schüppen für 124,60€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(124.60,'M Luzerne 2S');">Mein Pferd Füttern</a>&nbsp;<br>
Luzerne 3 Schüppen für 213,90€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(213.90,'M Luzerne 3S');">Mein Pferd Füttern</a></font>

</p>
<p><i><font face="Verdana" size="2">Stroh</font></i>
&nbsp;

</p>
<p><font size="2">pro Woche</font>

</p>
<p><font size="1">
Stroh 1 Rippe für 14,70€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(14.70,'W Stroh 1R');">Mein Pferd Füttern</a>&nbsp;<br>
Stroh 1 ½ Rippe für 18,20€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(18.20,'W Stroh 1,5R');">Mein Pferd Füttern</a>&nbsp;<br>
Stroh 2 Rippe für 29,40€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(29.40,'W Stroh 2R');">Mein Pferd Füttern</a>&nbsp;<br>
Stroh 2 ½ Rippe für 32,90€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(32.90,'W Stroh 2,5R');">Mein Pferd Füttern</a></font>

</p>
<p><font size="2">pro Monat</font>

</p>
<p><font size="1">
Stroh 1 Rippe für 65,10€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(65.10,'M Stroh 1R');">Mein Pferd Füttern</a>&nbsp;<br>
Stroh 1 ½ Rippe für 80,60€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(80.60,'M Stroh 1,5R');">Mein Pferd Füttern</a>&nbsp;<br>
Stroh 2 Rippe für 127,10€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(127.10,'M Stroh 2R');">Mein Pferd Füttern</a>&nbsp;<br>
Stroh 2 ½ Rippe für 145,70€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(145.70,'M Stroh 2,5R');">Mein Pferd Füttern</a></font>

</p>
<p><font size="2"><b>&nbsp;&nbsp;&nbsp; Einstreu</b></font>

</p>
<p><font size="2"><i>pro Monat</i></font>

</p>
  <font size="1">
Stroh für 45€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(45,'Einstreu Stroh');">Box Einstreuen</a>&nbsp;<br>
Staubfreie Spähne für 50€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(50,'Einstreu Allspan');">Box Einstreuen</a>&nbsp;<br>
Spähne super saugstark für 43,60€:&nbsp;&nbsp;&nbsp; <a href="javascript:newitem(43.60,'Einstreu Spähne Saugstark');">Box Einstreuen</a>&nbsp;</font>
<p><font size="1" face="Verdana">____________<br />
Kosten: <span id="costs">0</span>€

<?php

if(!empty($_POST)) {
	$count = array_count_values($_POST['items']);
	$all = 0;
	$mailcontent = "";

	foreach($count AS $item => $lot) {
		$explode = explode("|", $item);
		$mailcontent .= $explode[0]." wurde ". $lot." mal bestellt. Summe: ".($lot*$explode[1])."\n";
		$all += $lot*$explode[1];
	}
	mail("Gestuet-Rotmoor@web.de", "Shop", "Neuer Einkauf:\n\n".$mailcontent."\n\nGesamt: ".$all);
	echo "Danke auch!"
	}
?>

<script type="text/javascript">
function newitem(costs,value) {
	newelement = new Option(value,value+"|"+costs);
	document.getElementsByName("items[]")[0].options[document.getElementsByName("items[]")[0].length] = newelement;
	document.getElementById("costs").innerHTML = parseInt(document.getElementById("costs").firstChild.data) + costs;
}

function removeitem() {
	var item = document.getElementsByName("items[]")[0].value.split("|");
	document.getElementById("costs").innerHTML = parseInt(document.getElementById("costs").firstChild.data) - parseInt(item[1]);
	document.getElementsByName("items[]")[0].options[document.getElementsByName("items[]")[0].selectedIndex] = null;
}

function selectall() {
	for(i = 0; i < document.getElementsByName("items[]")[0].length; i++) {
		document.getElementsByName("items[]")[0].options[i].selected="selected"; 
	}
}
</script>

</p>

<form name="shopform" method="post" action="" onsubmit="selectall()">
  <select name="items[]" size="10" onchange="removeitem()" multiple="multiple">
  </select>
  <input type="submit" value="Absenden!">
</form>
  </blockquote>
</font>

<!--mstheme--></font></body>

</html>


Es kommt keine Fehlermeldung, nein, die seite springt einfach nach oben und es passier nix...

Danke schon mal für deine Hilfe smile
Tante Lulu
Mhh.. nein, immernoch der selbe Fehler. Alles geht nur das absenden nicht... aber da passiert dann aber auch nix....

Kann das daran liegen das ich mit FrontPage arbeite? Aber eigentlich doch nicht, oder? Ich weiß es auch nicht mehr...

Nochmal danke

Lulu