Sponsor-Board.de

Sponsor-Board.de > Webmaster > Script-Check > *gelöst* Frage zu Problem bei Javascript
Normale Version: *gelöst* Frage zu Problem bei Javascript
Du siehst gerade eine vereinfachte Darstellung unserer Inhalte. Normale Ansicht mit richtiger Formatierung.

VarmintLP

29.09.2014, 13:25
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.

Zitat:
<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:

Zitat:
<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:

Zitat:
var Belag1 = document.getElementsByName("Belag1")[0].value;


Meine erste If Abfrage war:

Zitat:
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

Aaron

29.09.2014, 14:01
[Link: Registrierung erforderlich]

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.

VarmintLP

29.09.2014, 14:10

Aaron schrieb:
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

Zitat:
<!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>

DebianDEV

29.09.2014, 14:11
Hi,

1: -> Pizzen - nicht Pizzas .....

2: -> onchange Eventhandler

3: Musterlösung für deine bereits umgesetzte Variante

Code:
if(document.getElementsByName("Belag1")[0].checked) {
   alert('Belag1 ausgewaehlt');
} else {
   alert('nope');
}

Phinitris

29.09.2014, 14:20
Hey,
hab dir gerade auch mal was auf die schnelle gebastelt ;D
Wie Nico schon sagte, am besten per onChange Funktion machen.

Code:
<!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>

Aaron

29.09.2014, 14:27
Wo steht denn was von jQuery in dem von mir geposteten Link? Biggrin

VarmintLP

29.09.2014, 14:38

Phinitris schrieb:
Hey,
hab dir gerade auch mal was auf die schnelle gebastelt ;D
Wie Nico schon sagte, am besten per onChange Funktion machen.

Code:
<!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

DebianDEV

29.09.2014, 14:39
Dann nimm doch dieses hier:

Code:
if(document.getElementsByName("Belag1")[0].checked) {
   alert('Belag1 ausgewaehlt');
} else {
   alert('nope');
}


".checked" = Is XYZ Checked?

Mehr dazu:
[Link: Registrierung erforderlich]

VarmintLP

29.09.2014, 14:46

CreativeDEV.de schrieb:
Dann nimm doch dieses hier:

Code:
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

sic_

29.09.2014, 18:31

Zitat:
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.

Seiten: 1 2
Sponsor-Board.de > Webmaster > Script-Check > *gelöst* Frage zu Problem bei Javascript
Referenz-URLs