*gelöst* Frage zu Problem bei Javascript
|
Verfasser |
Nachricht |
|
Beiträge: 433
Bewertung: 6
Registriert seit: Mar 2011
Status:
offline
|
*gelöst* Frage zu Problem bei Javascript
Guten Tag liebe Community,
Vor kurzem habe ich die Aufgabe bekommen einen Pizza Webshop (nur eine simple Version) zu erstellen. Ich bin jetzt bei der Abfrage der angaben.
Ich hab bereits mehrere Foren durchsucht und keine funktionierenden Ergebnis gefunden. Leider habe ich auch keine isset() funktion gefunden, die unter Javascript funktioniert.
Außerdem würde ich lieber mit PHP arbeiten, aber die Aufgabe sagt ausdrücklich nur Javascript.
Allerdings habe ich ein Problem.
Man kann zwischen 4 Pizzas auswählen.
<input type="radio" name="Pizza" value="Tonno" required>Tonno (Thunfisch, Zwiebel)<br>
<input type="radio" name="Pizza" value="Quattro" required>Quattro (Salami, Schinken)<br>
<input type="radio" name="Pizza" value="Italia" required>Italia (Schinken, Artischoke)<br>
<input type="radio" name="Pizza" value="Individuelle" required>Individuelle Zusammenstellung<br>
Soweit so gut. Nun wenn man Pizza 4 (Individuelle Zusammenstellung) auswählt, hat man folgende Zutaten:
<input type="checkbox" name="Belag1" value="Salami">Salami<br>
<input type="checkbox" name="Belag2" value="Schinken">Schinken<br>
<input type="checkbox" name="Belag3" value="Champignon">Champignon<br>
<input type="checkbox" name="Belag4" value="Käse">Käse<br>
Nun kommt das Problem. Ich weiß leider nicht, wie ich die Abfrage machen kann, ob die Checkbox ausgewählt wurde oder nicht.
Abfrage der Variablen ist:
var Belag1 = document.getElementsByName("Belag1")[0].value;
Meine erste If Abfrage war:
if (document.getElementsByName("Belag1").checked)
{
alert("Checked");
}
Alert ist meine Ausgabe, falls es klappt.
Am Ende sollen jedenfalls nur die Ausgewàhlten Zutaten oder die fertige Pizza ausgewählt werden.
Würde mich über eure Hilfe freuen.
Mit freundlichen Grüßen
VarmintLP
War der Beitrag hilfreich? Dann kann ein einfacher Klick auf den Danke-button ja wohl nicht schaden. 
Dieser Beitrag wurde zuletzt bearbeitet: 23.10.2014 10:56 von VarmintLP.
|
|
29.09.2014 13:25 |
|
|
Beiträge: 3.413
Bewertung: 33
Registriert seit: Oct 2010
Status:
offline
|
|
29.09.2014 14:01 |
|
|
Beiträge: 433
Bewertung: 6
Registriert seit: Mar 2011
Status:
offline
|
RE: Frage zu Problem bei Javascript
http://stackoverflow.com/questions/9887360/check-if-checkbox-is-checked-javascript
Natürlich musst du das ganze noch irgendwie auslösen/triggern - z.b. inline mit onclick()
Steht aber auch auf der von mir verlinkten Seite.
Da ist das nächste Problem. jQuerry hab ich leider keine Ahnung von und kann somit auch nichts mit dem Code anfangen und jQuerry ist auch nicht erlaubt in dieser Aufgabe.
Hier ist mal der Code von dem was ich bis jetzt habe
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859">
<title>Pizza Service</title>
<link rel="stylesheet" type="text/css" href="Layout.css">
</head>
<form action="Pizzashop.html" method="get">
<script>
function Bestellung()
{
var Size = document.getElementsByName("Size")[0].value;
var Pizza = document.getElementsByName("Pizza")[0].value;
var Belag1 = document.getElementsByName("Belag1")[0].value;
if (Pizza == "Individuelle")
{
var zusatz ="";
//with(document.lol)
// {
// for (var)
// }
if (document.getElementsByName("Belag1").checked)
{
alert("Checked");
}
else
{
var Check1 = 0;
alert (Check1);
}
}
var Belag2 = document.getElementsByName("Belag2")[0].value;
var Belag3 = document.getElementsByName("Belag3")[0].value;
var Belag4 = document.getElementsByName("Belag4")[0].value;
var Name = document.getElementsByName("Name")[0].value;
var Vorname = document.getElementsByName("Vorname")[0].value;
var Straße = document.getElementsByName("Straße")[0].value;
var PLZ = document.getElementsByName("PLZ")[0].value;
var Ort = document.getElementsByName("Ort")[0].value;
alert(Belag1);
alert(Size);
if (Belag2 == 1)
{
window.alert("Sie haben nicht sämtliche Angaben ausgefüllt!");
}
else if (Belag1 == 1)
{
window.alert("Sie haben keine Zutat ausgewählt!");
}
else
{
window.alert("Hallo Frau/Herr, \n\n"+Vorname+" "+Name+"\n"+Straße+"\n"+PLZ+" "+Ort+"\n\nSie haben folgende Pizza gewählt:\n\nGröße: "+Size+"\nArt der Pizza: "+Pizza+"");
}
}
</script>
<body>
<h3>WWW-Pizza Service</h3>
<p>
<u>Bestellung:</u>
<table border="0">
<tr bgcolor = 'skyblue'>
<td>
Größe
</td>
<td>
<input type="radio" name="Size" value="klein (20 cm)" required>klein (20 cm)<br>
<input type="radio" name="Size" value="mittel (24 cm)" required>mittel (24 cm)<br>
<input type="radio" name="Size" value="groß (28 cm)" required>groß (28 cm)<br>
</td>
</tr>
<tr bgcolor = 'lightgreen'>
<td>
Art der Pizza
</td>
<td>
<input type="radio" name="Pizza" value="Tonno" required>Tonno (Thunfisch, Zwiebel)<br>
<input type="radio" name="Pizza" value="Quattro" required>Quattro (Salami, Schinken)<br>
<input type="radio" name="Pizza" value="Italia" required>Italia (Schinken, Artischoke)<br>
</td>
</tr>
<tr bgcolor = 'lightblue'>
<td>
</td>
<td>
<input type="radio" name="Pizza" value="Individuelle" required>Individuelle Zusammenstellung<br>
<input type="checkbox" name="Belag1" value="Salami">Salami<br>
<input type="checkbox" name="Belag2" value="Schinken">Schinken<br>
<input type="checkbox" name="Belag3" value="Champignon">Champignon<br>
<input type="checkbox" name="Belag4" value="Käse">Käse<br>
</td>
</tr>
<tr bgcolor = 'lightyellow'>
<td>
Name, Vorname<br>
Straße<br>
PLZ, Ort
</td>
<td>
<input type="Text" name="Name" required><input type="Text" name="Vorname" required><br>
<input type="Text" name="Straße" required><br>
<input type="Text" name="PLZ" required><input type="Text" name="Ort" required><br>
</td>
</tr>
</table>
<button onclick="Bestellung()">Abschicken</button><button type="reset" value="Reset">Zurücksetzen</button>
</p>
</body>
</form>
</html>
War der Beitrag hilfreich? Dann kann ein einfacher Klick auf den Danke-button ja wohl nicht schaden. 
|
|
29.09.2014 14:10 |
|
|
Beiträge: 1.545
Bewertung: 62
Registriert seit: Jan 2011
Status:
offline
|
RE: Frage zu Problem bei Javascript
Hi,
1: -> Pizzen - nicht Pizzas .....
2: -> onchange Eventhandler
3: Musterlösung für deine bereits umgesetzte Variante
if(document.getElementsByName("Belag1")[0].checked) {
alert('Belag1 ausgewaehlt');
} else {
alert('nope');
}
---------------------------
[Link: Registrierung erforderlich] | [Link: Registrierung erforderlich]
Dieser Beitrag wurde zuletzt bearbeitet: 29.09.2014 14:24 von DebianDEV.
|
|
29.09.2014 14:11 |
|
|
Beiträge: 118
Bewertung: 9
Registriert seit: Dec 2012
Status:
offline
|
RE: Frage zu Problem bei Javascript
Hey,
hab dir gerade auch mal was auf die schnelle gebastelt ;D
Wie Nico schon sagte, am besten per onChange Funktion machen.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Pizza Services</title>
</head>
<body>
<input type="checkbox" name="Belag1" class="toppings" value="Salami" onchange="settopping(this);">Salami<br>
<input type="checkbox" name="Belag2" class="toppings" value="Schinken" onchange="settopping(this);">Schinken<br>
<input type="checkbox" name="Belag3" class="toppings" value="Champignon" onchange="settopping(this);">Champignon<br>
<input type="checkbox" name="Belag4" class="toppings" value="Käse" onchange="settopping(this);">Käse<br>
<script text="text/javascript">
function settopping(self) {
if (typeof toppings === "undefined") {
toppings = new Array();
var topps = document.getElementsByClassName("toppings");
Array.prototype.forEach.call(topps, function(topp) {
// Do stuff with the element
toppings[topp.name] = false;
});
}
toppings[self.name] = self.checked ? true : false;
console.log(toppings);
}
</script>
</body>
</html>
|
|
29.09.2014 14:20 |
|
|
Beiträge: 3.413
Bewertung: 33
Registriert seit: Oct 2010
Status:
offline
|
|
29.09.2014 14:27 |
|
|
Beiträge: 433
Bewertung: 6
Registriert seit: Mar 2011
Status:
offline
|
RE: Frage zu Problem bei Javascript
Hey,
hab dir gerade auch mal was auf die schnelle gebastelt ;D
Wie Nico schon sagte, am besten per onChange Funktion machen.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Pizza Services</title>
</head>
<body>
<input type="checkbox" name="Belag1" class="toppings" value="Salami" onchange="settopping(this);">Salami<br>
<input type="checkbox" name="Belag2" class="toppings" value="Schinken" onchange="settopping(this);">Schinken<br>
<input type="checkbox" name="Belag3" class="toppings" value="Champignon" onchange="settopping(this);">Champignon<br>
<input type="checkbox" name="Belag4" class="toppings" value="Käse" onchange="settopping(this);">Käse<br>
<script text="text/javascript">
function settopping(self) {
if (typeof toppings === "undefined") {
toppings = new Array();
var topps = document.getElementsByClassName("toppings");
Array.prototype.forEach.call(topps, function(topp) {
// Do stuff with the element
toppings[topp.name] = false;
});
}
toppings[self.name] = self.checked ? true : false;
console.log(toppings);
}
</script>
</body>
</html>
Ich blick da irgendwie nicht ganz durch @,@ Sorry
War der Beitrag hilfreich? Dann kann ein einfacher Klick auf den Danke-button ja wohl nicht schaden. 
|
|
29.09.2014 14:38 |
|
|
Beiträge: 1.545
Bewertung: 62
Registriert seit: Jan 2011
Status:
offline
|
|
29.09.2014 14:39 |
|
|
Beiträge: 433
Bewertung: 6
Registriert seit: Mar 2011
Status:
offline
|
RE: Frage zu Problem bei Javascript
Dann nimm doch dieses hier:
if(document.getElementsByName("Belag1")[0].checked) {
alert('Belag1 ausgewaehlt');
} else {
alert('nope');
}
".checked" = Is XYZ Checked?
Mehr dazu:
[Link: Registrierung erforderlich]
Hab dir ein Danke gegeben ^^
Jetzt fällt mir asuf, dass egal was ich auswähle Size und Pizza sind immer klein und Tonno ^^'
Hab aktuell echt ein kleines Hindernis in meinem Denkapparat
War der Beitrag hilfreich? Dann kann ein einfacher Klick auf den Danke-button ja wohl nicht schaden. 
|
|
29.09.2014 14:46 |
|
|
Beiträge: 677
Bewertung: 0
Registriert seit: Feb 2013
Status:
offline
|
RE: Frage zu Problem bei Javascript
Jetzt fällt mir asuf, dass egal was ich auswähle Size und Pizza sind immer klein und Tonno ^^'
Hab aktuell echt ein kleines Hindernis in meinem Denkapparat
Poste doch mal den aktuellen Stand.
Dieser Beitrag wurde zuletzt bearbeitet: 29.09.2014 18:33 von sic_.
|
|
29.09.2014 18:31 |
|
|