4. Javascript: Formularproblem mit Radio-Buttons

Javascript: Formularproblem mit Radio-Buttons

  • W

    Hallo,

    bastle gerade hier ein Formular mit verschiedenen Fragen und jeweils 4 Antwortmöglichkeiten.

    Je nachdem, welche Antwort gewählt wurde (mit Radiobuttons auswählbar) gibt's 1-4 Punkte. Das ganze läuft Zeile für Zeile ab, am ende werden / sollen dann alle Punkte zusammenaddiert werden.

    Mein Problem ist jetzt, dass ich gern hätte, dass neben der Frage und den vier antwortmöglichkeiten:

    Frage1:                                                           Punkte
        Antwort1 []  Antwort2 []   Antwort3 [X]   Antwort4[]      [b]3[/b]

Frage2:
        Antwort1 []  Antwort2 []   Antwort3 []    Antwort4[X]     [b]4[/b]

------------------------------------------------------------------------
Gesamtsumme:                                                        7

    rechts nebendran, immer die Punkte für die einzelnen Frage wiedergebe, und zwar DIREKT NACHDEM ein Radiobutton angewählt wurde. (oncheck).

    Keine Ahnung, wie ich das umsetzen soll.

    Mein Ansatz ist folgender, ich weiss aber nicht genau, wie ich jetzt sagen soll, dass er in Feld xyz, dann die entsprechenden Punkten ausgibt.

    function PunkteAnzeigen () {
  if (document.Testform.Art[0].checked == true) 
    {
    Hier jetzt die Anweisung zum Punkte ausgeben?!
    }

    Danke für eure Hilfe

    0
  • C

    Ich würde ein Formularfeld ohne Rahmen dort hinschreiben in welches bei dem entsprechenden Event-Handler dann die Punkte hineingeschrieben werden. (Das Feld eventuell Read-only für den Benutzer.)

    Caipi

    0
  • W

    Caipi schrieb:

    Ich würde ein Formularfeld ohne Rahmen dort hinschreiben in welches bei dem entsprechenden Event-Handler dann die Punkte hineingeschrieben werden. (Das Feld eventuell Read-only für den Benutzer.)

    Caipi

    hmm, danke schonmal, aber kannste nochmal kurz posten, wie du das genau meinst?

    0
  • W

    Du hast ein Formular? Dann mach das doch darüber, indem du die Werte der einzelnen Felder erfragst:

    <script language="javascript">
<!--
var punkte=new Array(10,20,30,40);
var richtig=new Array("1","2","3","4");
function ZeigePunkte(frage,e)
{
  var f=document.getElementById("f"+frage+"_"+e).value;
  if(richtig[frage]==f)
    document.getElementById("s"+frage).innerHTML=punkte[frage];
  else
    document.getElementById("s"+frage).innerHTML="&nbsp;";
}
//-->
</script>
<form>
<p>Frage 1<br>
<input type="radio" name="f0" id="f0_0" value="1" onClick="ZeigePunkte(0,0);" />
<input type="radio" name="f0" id="f0_1" value="2" onClick="ZeigePunkte(0,1);" />
<input type="radio" name="f0" id="f0_2" value="3" onClick="ZeigePunkte(0,2);" />
<input type="radio" name="f0" id="f0_3" value="4" onClick="ZeigePunkte(0,3);" />
<span id="s0"></span>
</p>
<p>Frage 2<br>
<input type="radio" name="f1" id="f1_0" value="1" onClick="ZeigePunkte(1,0);" />
<input type="radio" name="f1" id="f1_1" value="2" onClick="ZeigePunkte(1,1);" />
<input type="radio" name="f1" id="f1_2" value="3" onClick="ZeigePunkte(1,2);" />
<input type="radio" name="f1" id="f1_3" value="4" onClick="ZeigePunkte(1,3);" />
<span id="s1"></span>
</p>
<p>Frage 3<br>
<input type="radio" name="f2" id="f2_0" value="1" onClick="ZeigePunkte(2,0);" />
<input type="radio" name="f2" id="f2_1" value="2" onClick="ZeigePunkte(2,1);" />
<input type="radio" name="f2" id="f2_2" value="3" onClick="ZeigePunkte(2,2);" />
<input type="radio" name="f2" id="f2_3" value="4" onClick="ZeigePunkte(2,3);" />
<span id="s2"></span>
</p>
<p>Frage 4<br>
<input type="radio" name="f3" id="f3_0" value="1" onClick="ZeigePunkte(3,0);" />
<input type="radio" name="f3" id="f3_1" value="2" onClick="ZeigePunkte(3,1);" />
<input type="radio" name="f3" id="f3_2" value="3" onClick="ZeigePunkte(3,2);" />
<input type="radio" name="f3" id="f3_3" value="4" onClick="ZeigePunkte(3,3);" />
<span id="s3"></span>
</p>
</form>

    <edit>Jetzt funktioniert es. Habe vorhin keine Zeit gehabt es zu testen.</edit>

    0
  • W

    Hmm,

    ne funzt immer noch nicht ganz,

    bei den einzelnen Fragen, wird aufsteigend immer nur bei einem Radiobutton die Punkte angezeigt..

    Werd selbst nochmal drüber schauen, vielen Dank trotzdem.

    Wenn ich's habe, werde ich es hier reinposten

    0
  • W

    verdammt,

    keine Ahnung, was du da gemacht hast, ich blicks nicht durch 🙄

    Javascript liegt mir einfach nicht (Ich sollte es wirklich einmal RICHTIG lernen)

    0
  • W

    Ach, ich mache das jetzt einfach mal ganz simpel und einfallslos

    <input type="radio"  name="Test" value="1" onClick="this.form.Ausgabe.value = document.write('1');">

...
<input type="radio"  name="Test" value="2" onClick="this.form.Ausgabe.value = document.write('2');">

    usw.

    Problem ist nur noch, dass er momentan einfach den Wert in einer neuen Seite anzeigt. Wie kann ich ihm denn beibringen, dass er in ein vordefiniertes Feld schreibt?

    <input type="text" size="3" name="Ausgabe" readonly="readonly">

    Ich hoffe, es ist verständlich, was ich meine

    0
  • C

    Nicht

    this.form.Ausgabe.value = document.write('1');

    Sondern nur

    this.form.Ausgabe.value = 1;

    Caipi

    0
  • W

    Caipi schrieb:

    Nicht

    this.form.Ausgabe.value = document.write('1');

    Sondern nur

    this.form.Ausgabe.value = 1;

    Caipi

    Mann, mann 🙄

    Danke sehr.

    Du hast vergessen, dass ich das gefragt habe, alles klar? 😃

    0
  • W

    So,

    eins noch:

    Ich hab jetzt am Ende noch ein Feld eingefügt, was mir immer die aktuelle Gesamtpunktzahl anzeigen soll.

    Ich weiss aber nicht, welchen Event man dafür benutzt, oder ob man überhaupt einen braucht. Ich hab schon eine Funktion, die mir die einzelnen Punkte zusammenzählt:

    function PunkteAddieren(obj1, obj2, obj3, obj4, obj5, obj6)
{
    var ergebnis = 0;
    ergebnis += parseInt(radioWert(obj1));
    ergebnis += parseInt(radioWert(obj2));
    ergebnis += parseInt(radioWert(obj3));
    ergebnis += parseInt(radioWert(obj4));
    ergebnis += parseInt(radioWert(obj5));
    ergebnis += parseInt(radioWert(obj6));

    alert("Sie haben "+ergebnis+" Punkte erreicht!");
    //window.document.Eingabe.Ergebnis.value = ergebnis;
}

    Die wird aufgerufen, wenn der User einen Button "Auswerten" drückt. Kann ich die irgendwie gleichzeitig auch dafür missbrauchen, dass mir eben in einem bestimmten Feld immer die "aktuelle" Gesamtpunktzahl angezeigt wird?

    0
  • C

    Das hab ich jetzt nicht so ganz verstanden. Willst du dass wenn der Benutzer z.B. bisher erst die ersten 3 Fragen beantwortet hat schon die aktuelle Punktzahl ermittelt wird? Oder wie?

    Wenn ja, dann...

    Ich gehe nun davon aus, dass dein Formular etwa so aussieht:

    Frage1:      Button1 []    Button2[]     Button3[]     Button4[]     Ausgabe_fuer_diese_Frage [     ]
Frage2:      Button1 []    Button2[]     Button3[]     Button4[]     Ausgabe_fuer_diese_Frage [     ]
...
-------------------------------------------------------------------------------------------------------
                          Aktuelles Gesammtergebnis: Ausgabefeld_mit_aktuellem_Gesammtergebnis [     ]

    Nach jeder Veränderung eines Radio-Buttons schreibst du die Anzahl der erreichten Punkte in das Ausgabefeld der jeweiligen Frage.

    Dann rufst einfach nach jeder Veränderung im "Ausgabe-Feld" die Funktion addierePunkte() auf, welche alle Werte aus den Ausgabe-Feldern zusammenzählt und ausgibt. (Um eventuelle Fehler abzufangen, solltest du die Ausgabe-Felder readonly machen sowie per Default-Wert mit 0 vorbelegen).

    Ich glaube aber ehrlich gesagt weniger dass es das ist, was du meinst. Falls nicht, schildere doch noch mal etwas genauer was du willst.

    Caipi

    0
  • W

    hmm, doch,

    so ähnlich meinte ich das schon.

    Mein Formular sieht wie oben von dir beschrieben aus, hat 6 Fragen, wenn der User jetzt die einzelnen Fragen beantwortet, sieht er ja rechts die Punkte für die einzelne Antwort.

    Hinzukommen soll jetzt, dass am Ende des Formulars gleichzeitig die derzeitige Gesamtpunktzahl steht. (Ist eben eine Vorgabe). Man muss zwar alle Fragen beantworten (hab ich schon gemacht), aber dennoch soll die Gesamtpunktzahl immer da stehen.

    Ich soll also nach jeder Frage schon immer die Funktion aufrufen?
    Wie denn genau?,d.h. mit welchem Event?!

    0
  • W

    im onClick-Ereignis der Radiobuttons...? - oder im onChange-Ereignis des Eingabefeldes, mehrere Funktionen hinereinander aufrufen kannst du, indem du sie mit Semikolon trennst...

    0
  • C

    Ich würde die Funktion punkteAddieren immer dann aufrufen, wenn du irgendwas in den einzelnen Ausgabe-Feldern der Fragen veränderst. D.h. am besten wenn du einen Radio-Button anklickst.

    Also dass bei jedem Klick (bzw. Änderung) eines Radio-Buttons der Event-Handler onClick ungefähr so aussieht:
    [html]
    <input type="radio" name="fragen_gruppe" value="fragen_wert" onClick="this.form.ergebnis_feld_von_aktueller_frage.value = 1**;PunkteAddieren()**">[/html]

    /edit: Zu spät...

    Caipi

    0
  • W

    hmm, ok

    und wie gebe ich die dann am besten aus?

    <input size="7" name="AusgabeGesamt" readonly="readonly" .:??:.>

    Muss ich dafür einen zentralen Namen vergeben?

    0
  • W

    Indem du auf das Element zugreifst...?

    document.Formular.GesamtPunkte.value="...";
    0
  • W

    Windoof schrieb:

    Indem du auf das Element zugreifst...?

    document.Formular.GesamtPunkte.value="...";

    Schon klar, aber ich kann das doch nicht einfach so übergeben, oder?

    <input size="7" name="AusgabeGesamt" readonly="readonly" document.Eingabe.AusgabeGesamt.value= ?; >
    0
  • W

    wie willst du das dort bitte übergeben...? Dir sind schon die Javascript-Grundkenntnisse bekannt? - Ich denke nicht... per Javascript übergibst dudas... in deiner Funktion zum Zusammenrechnen...

    0
  • W

    *hüstel*

    ok 🙄

    0
  • W

    ok,

    ich hab jetzt fast alles, so wie ich es brauche (wahrscheinlich alles quick 'n dirty), komme bloss bei einer Sache nicht weiter.

    Und zwar hab ich verschachtelte If-Abfragen:

    if (Fall x)
{
    if(Fall y <= 10)
    {
        alert("irgendwas")
    }
    alert("Das hier erscheint immer:(")
}
else (Fall z)
{
    alert("unwichtig")
}

    Und zwar, wenn Fall x und Fall y <= 10 zusammen eintreten, gibt er korrekterweise "irgendwas" aus, aber leider danach auch nochmal "Das hier erscheint immer".

    Wenn ich den break-Befehl benutze, um vorzeitig aus der Schleife zu springen, bekomme ich eine Fehlermeldung.

    Die && - Verknüpfung kann ich nicht benutzen, d.h. wie sie funzt, weiss ich schon, aber man kann sie in diesem speziellen Fall nicht einsetzen (Ist so!, aber etwas umständlich das jetzt zu erklären).

    Mach ich was falsch, oder gibt's noch ne andere Methode?

    0
Anmelden zum Antworten