Radiobuttonauswahl mit Feedback

[rulenz]

Hey!
Mit der SuFu finde ich nicht wirklich was brauchbares. Mein Problem ist: ich will ein Formular erstellen und wenn ein Radiobutton ausgewählt wird, soll der Browser einen Satz ausgeben. Nur schaffe ich das nciht. wie kann ich das in einem HTML-Script lösen?

 <p>Geben Sie die Kartenanzahl an:</p>
  <p>
    <input type="radio" name="ka" value="1"> 1<br>
    <input type="radio" name="ka" value="2"> 2<br>
    <input type="radio" name="ka" value="3"> 3<br>
    <input type="radio" name="ka" value="4"> 4
  </p>

Wenn man jz 1, 2, 3 oder 4 auswählt, soll der Kartenpreis mithilfe eines Satzes ausgegeben werden.

lg

 

[threadi]

HTML-Scripte gibt es nicht. Was Du brauchst ist JavaScript.

 

[rulenz]

wie würde so eines dann aussehen?

 

[struppi]

so: alert('Hallo');

 

[rulenz]

das wird mir ohne if funktion aber nicht helfen. wie leite ich die ein, das ist mein größtes problem :-S

 

[struppi]

so: if(true) alert('Hallo');

 

[rulenz]

Wäre das dann:

 	if (ka = 1)
               	   alert ('Kartenpreis 10 Euro)
               	   
               	else if (ka = 2)
               	   alert ('Kartenpreis 20 Euro);
               	   
               	else if (ka = 3)
               	   alert ('Kartenpreis 30 Euro);
 
               	else
               	   alert ('Kartenanzahl bitte auswählen!);

Stimmt das so?

 

[struppi]

Nein, das ist vermutlich falsch, beschäftige dich mit den Grundlagen SELFHTML: JavaScript / Sprachelemente / Bedingte Anweisungen (if-else/switch)

 

[rulenz]

Nein, das ist vermutlich falsch, beschäftige dich mit den Grundlagen SELFHTML: JavaScript / Sprachelemente / Bedingte Anweisungen (if-else/switch)

Danke! Das hab ich jetzt. Bin auch schon auf einem guten Weg, ABER wie greife ich als Bedingung auf das HTML zurück?

 

[philipp1988]

du musst deinen input Feldern die DOM-Methode onchange mitgeben.

<input type="radio" name="radio1" id="radio1" onchange="funktion()" />

Und dann schreibst du dir die Javascript Funktion die je nach Wert ein Alert ausgibt.

 

[rulenz]

Ah. Ok. Hab onchange nochmal bei selfhtml eingegeben und bin dann auf onclick gestoßen. Hab das jetzt damit gelöst. Nochmals vielen Dank für die hilfreichen und nützlichen Antworten

 

[struppi]

Man muss aber auch sagen, dass deine Fragen sehr wage sind (falls das ironisch gemeint war), aber schön dass es du trotz meiner zurückhaltung weiter gekommen bist.

Aber noch ein Hinweis

onchange ist hier prinzipiell falsch, denn onchange sollte feuern, wenn sich der wert ändern, was bei einer Radiobutton ja eher selten der Fall ist. Daher ist onclick genau der richtige Event.

Noch einen Tipp:

Du kannst in solchen Eventhandler mehr Informationen übermitteln, z.b. das Element an sich:

<input type="radio" name="radio1" id="radio1" onchange="funktion(this)">

Der Parameter ist jetzt eine Referenz auf das Element:

function funktion(el) {
alert(el.checked);
}

Darüber hinaus hat jedes Element in einem Formular auch eine Referenz auf das Formular als Eigenschaft:

function funktion(el) {
alert(el.form);
}

Du brauchst also, zumindest für das JS, keinen Namen für das Formular und keine ID für das Element.

 

[philipp1988]

@struppi: Du hast natürlich Recht. onclick ist hier das Gesuchte ;)

 

[rulenz]

Man muss aber auch sagen, dass deine Fragen sehr wage sind (falls das ironisch gemeint war), aber schön dass es du trotz meiner zurückhaltung weiter gekommen bist.

Nein, war nicht ironisch gemeint, da mein Wissen noch in den Kinderschuhen steckt und ich wirklich über jeden Tipp und Hinweiß froh bin

 

[struppi]

Hat man auch gemerkt ;)

Du hast ja sogar den kleinen Lapsus von philipp selbst endeckt.

Es ist halt oft so, dass es Leute gibt, die hier ihre Frage abladen. Gerne auch so formuliert, dass man sich drei-, viermal die Frage durchlesen muss, bevor man begreift, was der Fragende will. Und dann anfangen zu Krakelen, wenn man ihnen (genau so schlampig) einfach einen Link hinwirft.

Aber diesmal lief es ja glücklicherweise anders

 

[rulenz]

Es ist halt oft so, dass es Leute gibt, die hier ihre Frage abladen. Gerne auch so formuliert, dass man sich drei-, viermal die Frage durchlesen muss, bevor man begreift, was der Fragende will. Und dann anfangen zu Krakelen, wenn man ihnen (genau so schlampig) einfach einen Link hinwirft.

Ich kenn das zu genüge aus anderen Foren.
Ich hab noch einen Weg ohne Java(ist das richtig? Müsste eigentlich sein, weil ja kein Script vorhanden ist) gefunden, welcher mir eigentlich besser gefällt, aber ich hab wenigstens dabei was gelernt :-D

 <p>Geben Sie die Kartenanzahl an:</p>
  <p>
    <input type="radio" name="KA" value="1" onclick="this.form.Ausgabe.value = 10" />1
    <input type="radio" name="KA" value="2" onclick="this.form.Ausgabe.value = 20" />2
    <input type="radio" name="KA" value="3" onclick="this.form.Ausgabe.value = 30" />3
    <input type="radio" name="KA" value="4" onclick="this.form.Ausgabe.value = 40" />4
  </p>
<p> Kartenpreis: </p><input type="text" size="30" name="Ausgabe" readonly="readonly"><br>

EDIT: ich weiß, es ist hässlich, aber es tut seine Sache.

 

[philipp1988]

Es heisst doch nicht Java, nur weil es kein "richtiges Script" ist. oO

Java und Javascript sind 2 extrem unterschiedliche Sprachen ;).

 

[rulenz]

Es heisst doch nicht Java, nur weil es kein "richtiges Script" ist. oO

Java und Javascript sind 2 extrem unterschiedliche Sprachen ;).

Ah ok, da hat man wieder was gelernt. Dachte das gehört zusammen.
Auf alle Fälle funktioniert das Formular wie es soll, das Abschicken bekomm ich auch noch hin. Morgen ist ja auch noch zeit. :-D

 

[struppi]

Ich hab noch einen Weg ohne Java(ist das richtig? Müsste eigentlich sein, weil ja kein Script vorhanden ist) gefunden,

this.form.Ausgabe.value = ... ist das Javascript. Aber warum schickst du nicht einfach das Formular mit einem Submitbutton ab, dann brauchst du das gar nicht.

 

[rulenz]

this.form.Ausgabe.value = ... ist das Javascript. Aber warum schickst du nicht einfach das Formular mit einem Submitbutton ab, dann brauchst du das gar nicht.

Ich meinte damit die Übergabe an den PHP Mailer. Hab mich schlecht ausgedrückt. Sorry.