HTML + Javascript für eine imaginäre Pizzeria-Homepage

foxxx

foxxx

Moderator
Thread Starter
Mitglied seit
15.02.2006
Beiträge
11.765
Ort
/dev/null
Moin Leutz,
In Info machen wir atm HTML/Javascript und den Krams ...
damit hab ich auch keine Probleme ... mir fehlt nur ein besch****ner befehl für die ausgabe :wall:

Aufgabe lautet wie folgt:

Man soll eine Html-Page erstellen, wo man eine Pizza mit ein paar Optionen bestellen kann.
Wenn man alle Sachen ausgewählt hat, soll im textarea-Feld eine Zusammenfassung dessen erscheinen, was man im oberen Teil ausgewählt hat.
Wir haben dazu eine A4-Seite bekommen, wie das ganze aussehen soll, denn der Lehrer will, dass wir auch mit den Tabellen und Positions-Tags umgehen können.
Der Body bereich ist soweit fertig, wüsste nicht, was da fehlt (sieht 1:1 wie auf der Vorgabe aus).

Hier mal meine komplette .html:

Code: 
<html>
	<head>
		<title>Meine Pizzeria</title>
	</head>
	<script language="javascript">
		function bestellen() {
			var nname ;
			var vname ;
			var pizza ;
			var ppreis
			var aufp ;
			var ofp ;
			var zahlung ;
			var endpreis ;
			var z1 ;
			var z2 ;
			var z3 ;
			var z4 ;
			
			z1 = 0 ;
			z2 = 0 ;
			z3 = 0 ;
			z4 = 0 ;
			aufp = 0 ;
			
			if(z1==0) {
				z1 = "" ;
				}
			if(z2==0) {
				z1 = "" ;
				}
			if(z3==0) {
				z1 = "" ;
				}
			if(z4==0) {
				z1 = "" ;
				}				
			
			nname = document.f1.nname.value ;
			vname = document.f1.vname.value ;
			
			if(document.f1.pizza.options[0].checked) {
				pizza = "Napoli" ;
				ppreis = 5.50 ;
				}
			if(document.f1.pizza.options[1].checked) {
				pizza = "Mexicana" ;
				ppreis = 5.25 ;
				}
			if(document.f1.pizza.options[2].checked) {
				pizza = "Quatro Stagioni" ;
				ppreis = 6.75 ;
				}
			if(document.f1.pizza.options[3].checked) {
				pizza = "Calzone" ;
				ppreis = 5.75 ;
				}												
			
			if(document.f1.zahlung[0].checked) {
				zahlung = "Visa" ;
				}
			if(document.f1.zahlung[1].checked) {
				zahlung = "Mastercard" ;
				}			
			if(document.f1.zahlung[2].checked) {
				zahlung = "American Express" ;
				}
				
			if(document.f1.aufp[0].checked) {
				aufp = aufp+1 ;
				z1 = "Käse" ;
				}
			if(document.f1.aufp[1].checked) {
				aufp = aufp+1 ;
				z2 = "Peparoni" ;
				}			
			if(document.f1.aufp[2].checked) {
				aufp = aufp+1 ;
				z3 = "Pilze" ;
				}				
			if(document.f1.aufp[3].checked) {
				aufp = aufp+1 ;
				z4 = "Ananas" ;
				}
			if(document.f1.ofp[0].checked) {
				ofp = "scharf" ;
				}
			if(document.f1.ofp[1].checked) {
				ofp = "mittelscharf" ;
				}			
			if(document.f1.ofp[2].checked) {
				ofp = "sehr scharf" ;
				}					
			
			endpreis = ppreis + aufp ;
			
			
			document.f1.output.value = ("Sehr geehrter Herr/Frau " + vname + nname + ","
										+ " Ihre Bestellung sieht wie folgt aus:"
										+ " Sie haben eine Pizza " + pizza + " bestellt. Außerdem wollen Sie auf ihre Pizza " + pizza
										+ " : " + z1 +" , " + z2 + " , " + z3 + " , " + z4 + " . "
										+ " Sie möchten Ihre Pizza " + ofp + "zubereitet haben."
										+ " Den Gesamtbetrag in Höhe von " + endpreis + " Euro wollen Sie per " + zahlung + " bezahlen . "
										+ " Vielen Dank für Ihre Bestellung, Ihr Pizzeria-Team ;-)") ;
		}			
	</script>
	<body bgcolor="#33CC99">
		<form name="f1">
			<colgroup>

				<col width="150">
			</colgroup>
			<tr>
				<th><h2>Meine Pizzeria</h2></th>
			</tr>
			<tr>
				<td><p position="absolute" align="left"><input type="text" name="nname"> Name <br>

					<input type="text" name="vname"> Vorname<br>
					<br>
					<select size="1" name="pizza">
						<option >Pizza Napoli 5,50 Euro</option>
						<option>Pizza Mexicana 5,25 Euro</option>
						<option>Pizza Quatro Stagioni 6,75 Euro</option>

						<option>Pizza Calzone 5,75 Euro</option>
					</select><br>
					je Zusatzoption 1 Euro: <br>
					<input name="aufp" type="checkbox"> Käse <br>
					<input name="aufp" type="checkbox"> Peparoni <br>

					<input name="aufp" type="checkbox"> Pilze <br>
					<input name="aufp" type="checkbox"> Ananas <br>
					<br>
					ohne Aufpreis: <br>
					<input name="ofp" type="radio"> scharf <br>

					<input name="ofp" type="radio"> mittelscharf <br>
					<input name="ofp" type="radio"> sehr scharf <br>
					<br>
					Zahlungsmethode: <br>
					<input name="zahlung" type="radio"> Visa <br>

					<input name="zahlung" type="radio"> Mastercard <br>
					<input name="zahlung" type="radio"> American Express <br>
					<br>
					<input type="button" value="       Bestellung abschicken       " onClick="bestellen()"> <br>
					<br>
					<textarea name="output" rows="9" cols="35"></textarea></p>
					</td>
			</tr>
		</form>
	</body>

</html>


Hab das ganze mal auf den Webserver geladen, wie es im Moment ist:

http://www.lpcserver.de/pizzeria.html

So, mir fehlt der genaue Befehl, um in dieses textarea-Feld unten zu schreiben, ich hab schon bei selfhtml gesucht, gegooglet usw .... ich finds einfach nicht :hmm:

mfg
foxxx
 
Zuletzt bearbeitet:
Wenn Du diese Anzeige nicht sehen willst, registriere Dich und/oder logge Dich ein.
document.f1.output.value = "blablubb" schon versucht ?
 
FF Fehlerkonsole schrieb:
Fehler: document.f1.output.value is not a function
Quelldatei: file:///../../../pizza.html
Zeile: 87
Zum Vergrößern anklicken....

hm, geht also auch nicht ... :(

wie mach ich nen zeilenumbruch innerhalb dieses zu schreibenden textes ?

<br> geht nicht, und /n isses auch nicht ....

mfg
foxxx



€: aaahhhh, jetzt gehts, war noch tippfehler drin ...

ausgabe sieht dann allerdings so aus:

output schrieb:
Sehr geehrter Herr/FrauFOXXXLUXXER,Ihre Bestellung sieht wie folgt aus:Sie haben eine Pizzaundefinedbestellt. Außerdem wollen Sie auf ihre Pizzaundefined:Käse,undefined,Pilze,undefined.Sie möchten Ihre Pizzamittelscharfzubereitet haben.Den Gesamtbetrag in Höhe vonNaNEuro wollen Sie perAmerican Expressbezahlen.Vielen Dank für Ihre Bestellung, Ihr Pizzeria-Team ;-)
Zum Vergrößern anklicken....
 
Zuletzt bearbeitet:
also ich hab noch weiter rumprobiert ... aber ich bekomm es einfach nicht hin :confused:
code im ersten post jetzt so hingeschrieben, wie er aktuell ist....


pls help :(

mfg
foxxx
 
Hilft dir das: http://de.selfhtml.org/javascript/objekte/document.htm#writeln?
Soll das gleich in das Textfeld unten reingeschrieben werden, wenn man bsp. das feld "Name" verlässt?

Code: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<title>Meine Pizzeria</title>
	</head>

	<body bgcolor="#33CC99">
	<script type="text/javascript">
		function bestellen() {
			var nname;
			var vname;
			var pizza;
			var ppreis;
			var aufp;
			var ofp;
			var zahlung;
			var endpreis;
			var z1;
			var z2;
			var z3;
			var z4;

			z1 = 0;
			z2 = 0;
			z3 = 0;
			z4 = 0;
			aufp = 0;

			if(z1 == 0) {
				z1 = "";
				}
			if(z2 == 0) {
				z1 = "";
				}
			if(z3 == 0) {
				z1 = "";
				}
			if(z4 == 0) {
				z1 = "";
				}

			nname = document.f1.nname.value ;
			vname = document.f1.vname.value ;

			if(document.f1.pizza.napoli.checked) {
				pizza = "Napoli";
				ppreis = 5.50;
				}
			if(document.f1.pizza.mexicana.checked) {
				pizza = "Mexicana";
				ppreis = 5.25;
				}
			if(document.f1.pizza.options[2].checked) {
				pizza = "Quatro Stagioni";
				ppreis = 6.75;
				}
			if(document.f1.pizza.options[3].checked) {
				pizza = "Calzone";
				ppreis = 5.75;
				}

			if(document.f1.zahlung[0].checked) {
				zahlung = "Visa";
				}
			else if(document.f1.zahlung[1].checked) {
				zahlung = "Mastercard";
				}
			if(document.f1.zahlung[2].checked) {
				zahlung = "American Express";
				}

			if(document.f1.aufp[0].checked) {
				aufp = aufp+1;
				z1 = "Käse";
				}
			if(document.f1.aufp[1].checked) {
				aufp = aufp+1;
				z2 = "Peparoni";
				}
			if(document.f1.aufp[2].checked) {
				aufp = aufp+1;
				z3 = "Pilze";
				}
			if(document.f1.aufp[3].checked) {
				aufp = aufp+1;
				z4 = "Ananas";
				}
			if(document.f1.ofp[0].checked) {
				ofp = "scharf";
				}
			if(document.f1.ofp[1].checked) {
				ofp = "mittelscharf";
				}
			if(document.f1.ofp[2].checked) {
				ofp = "sehr scharf";
				}

			endpreis = ppreis+aufp;



			document.f1.output.value = ("Sehr geehrter Herr/Frau " + vname + nname + ","
										+ " Ihre Bestellung sieht wie folgt aus:"
										+ " Sie haben eine Pizza " + pizza + " bestellt. Außerdem wollen Sie auf ihre Pizza " + pizza
										+ " : " + z1 +" , " + z2 + " , " + z3 + " , " + z4 + ". "
										+ " Sie möchten Ihre Pizza " + ofp + " zubereitet haben."
										+ " Den Gesamtbetrag in Höhe von " + endpreis + " Euro wollen Sie per " + zahlung + " bezahlen. "
										+ " Vielen Dank für Ihre Bestellung, Ihr Pizzeria-Team ;-)") ;
		}
	</script>
		<form name="f1" action="">
		<table>
			<tr>
				<th><h2>Meine Pizzeria</h2></th>
			</tr>
			<tr>
				<td>
					<p style="position:absolute;" align="left">
					<input type="text" name="nname"> Name <br>

					<input type="text" name="vname"> Vorname<br>
					<br>
					<select size="1" name="pizza">
						<option>Pizza Napoli 5,50 Euro</option>
						<option>Pizza Mexicana 5,25 Euro</option>
						<option>Pizza Quatro Stagioni 6,75 Euro</option>
						<option>Pizza Calzone 5,75 Euro</option>
					</select>
					<br>

					je Zusatzoption 1 Euro:
					<br>
					<input name="aufp" type="checkbox"> Käse <br>
					<input name="aufp" type="checkbox"> Peparoni <br>
					<input name="aufp" type="checkbox"> Pilze <br>
					<input name="aufp" type="checkbox"> Ananas <br>
					<br>

					ohne Aufpreis:
					<br>
					<input name="ofp" type="radio"> scharf <br>
					<input name="ofp" type="radio"> mittelscharf <br>
					<input name="ofp" type="radio"> sehr scharf <br>
					<br>

					Zahlungsmethode:
					<br>
					<input name="zahlung" type="radio"> Visa <br>
					<input name="zahlung" type="radio"> Mastercard <br>
					<input name="zahlung" type="radio"> American Express <br>
					<br>

					<input type="button" value="Bestellung abschicken" onClick="return bestellen()"> <br>
					<br>
					<textarea name="output" rows="9" cols="35"></textarea></p>
					</td>
			</tr>
			</table>
		</form>
	</body>

</html>

Ohne Fehler ;)

Aber rechnen tut der nicht...
 
Zuletzt bearbeitet:
nein, sobald man auf "Bestellen" klickt, soll die Zusammenfassung unten ins textfeld ....

dein link sieht zwar ganz gut aus, die write und writeln funktionen gehen aber nur bei websiten direkt und können nicht in textareas schreiben ...
 
ja, er rechnet nicht ^^

das ist u.a. das problem, und die zeilenumbrüche (insgesamt textformatierung) will auch noch nicht ....

ist ja doch schwerer als angenommen :fresse:
 
Code: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<title>Meine Pizzeria</title>
	</head>

	<body bgcolor="#33CC99">
	<script type="text/javascript">
		function bestellen() {
			var nname;
			var vname;
			var pizza;
			var ppreis;
			var aufp;
			var ofp;
			var zahlung;
			var endpreis;
			var z1;
			var z2;
			var z3;
			var z4;

			z1 = 0;
			z2 = 0;
			z3 = 0;
			z4 = 0;
			aufp = 0;

			if(z1 == 0) {
				z1 = "";
				}
			if(z2 == 0) {
				z1 = "";
				}
			if(z3 == 0) {
				z1 = "";
				}
			if(z4 == 0) {
				z1 = "";
				}

			nname = document.f1.nname.value;
			vname = document.f1.vname.value;

			if(document.f1.pizza[0].checked) {
				pizza = "Napoli";
				ppreis = 5.50;
				}
			if(document.f1.pizza[1].checked) {
				pizza = "Mexicana";
				ppreis = 5.25;
				}
			if(document.f1.pizza[3].checked) {
				pizza = "Quatro Stagioni";
				ppreis = 6.75;
				}
			if(document.f1.pizza[3].checked) {
				pizza = "Calzone";
				ppreis = 5.75;
				}


			if(document.f1.aufp[0].checked) {
				aufp = aufp+1;
				z1 = "Käse";
				}
			if(document.f1.aufp[1].checked) {
				aufp = aufp+1;
				z2 = "Peparoni";
				}
			if(document.f1.aufp[2].checked) {
				aufp = aufp+1;
				z3 = "Pilze";
				}
			if(document.f1.aufp[3].checked) {
				aufp = aufp+1;
				z4 = "Ananas";
				}


			if(document.f1.ofp[0].checked) {
				ofp = "scharf";
				}
			if(document.f1.ofp[1].checked) {
				ofp = "mittelscharf";
				}
			if(document.f1.ofp[2].checked) {
				ofp = "sehr scharf";
				}


			if(document.f1.zahlung[0].checked) {
				zahlung = "Visa";
				}
			else if(document.f1.zahlung[1].checked) {
				zahlung = "Mastercard";
				}
			if(document.f1.zahlung[2].checked) {
				zahlung = "American Express";
				}



			endpreis = ppreis+aufp;



			document.f1.output.value = ("Sehr geehrter Herr/Frau " + vname +" " + nname + ","
										+ " Ihre Bestellung sieht wie folgt aus:"
										+ " Sie haben eine Pizza " + pizza + " bestellt. Außerdem wollen Sie auf ihre Pizza " + pizza
										+ " : " + z1 +" , " + z2 + " , " + z3 + " , " + z4 + ". "
										+ " Sie möchten Ihre Pizza " + ofp + " zubereitet haben."
										+ " Den Gesamtbetrag in Höhe von " + endpreis + " Euro wollen Sie per " + zahlung + " bezahlen. "
										+ " Vielen Dank für Ihre Bestellung, Ihr Pizzeria-Team ;-)") ;
		}
	</script>
		<form name="f1" action="">
		<table>
			<tr>
				<th><h2>Meine Pizzeria</h2></th>
			</tr>
			<tr>
				<td>
					<p style="position:absolute;" align="left">
					<input type="text" name="nname"> Name <br>

					<input type="text" name="vname"> Vorname<br>
					<br>
					<input name="pizza" type="radio">Pizza Napoli 5,50 Euro<br>
					<input name="pizza" type="radio">Pizza Mexicana 5,25 Euro<br>
					<input name="pizza" type="radio">Pizza Quatro Stagioni 6,75 Euro<br>
					<input name="pizza" type="radio">Pizza Calzone 5,75 Euro<br>
					<br>

					je Zusatzoption 1 Euro:
					<br>
					<input name="aufp" type="checkbox"> Käse <br>
					<input name="aufp" type="checkbox"> Peparoni <br>
					<input name="aufp" type="checkbox"> Pilze <br>
					<input name="aufp" type="checkbox"> Ananas <br>
					<br>

					ohne Aufpreis:
					<br>
					<input name="ofp" type="radio"> scharf <br>
					<input name="ofp" type="radio"> mittelscharf <br>
					<input name="ofp" type="radio"> sehr scharf <br>
					<br>

					Zahlungsmethode:
					<br>
					<input name="zahlung" type="radio"> Visa <br>
					<input name="zahlung" type="radio"> Mastercard <br>
					<input name="zahlung" type="radio"> American Express <br>
					<br>

					<input type="button" value="Bestellung abschicken" onClick="return bestellen()"> <br>
					<br>
					<textarea name="output" rows="9" cols="35"></textarea></p>
					</td>
			</tr>
			</table>
		</form>
	</body>

</html>

Ohne Drop-Down Menü geht's :fresse: Dann rechnet er auch richtig.
 
Zuletzt bearbeitet:
ja toll, das bringt's mir auch nicht :fresse:

Also fehlt mir noch der befehl um den wert aus dem dropdownmenü zu kriegen, und wie ich zeilenumbrüche in der textarea mache ....
 
Anmelden, um zu antworten.
Hardwareluxx setzt keine externen Werbe- und Tracking-Cookies ein. Auf unserer Webseite finden Sie nur noch Cookies nach berechtigtem Interesse (Art. 6 Abs. 1 Satz 1 lit. f DSGVO) oder eigene funktionelle Cookies. Durch die Nutzung unserer Webseite erklären Sie sich damit einverstanden, dass wir diese Cookies setzen. Mehr Informationen und Möglichkeiten zur Einstellung unserer Cookies finden Sie in unserer Datenschutzerklärung.


Zurück
Oben Unten refresh