Seite 1 von 1

Formular nicht bei Klick auf Eingabetaste auslesen

Verfasst: Mittwoch 24. Juli 2024, 16:27
von Pitwheazle
Bei meinem Rechentrainer genügt der Klick auf die Entertaste, um das Ergebnis zu kontrollieren.
Beim Rechenduell soll das unterbunden werden. Hier wird eine Aufgabe erstellt und zwei Kandidaten ausgelost. Hier soll das Ergebnis erst übermittelt werden, wenn auf den Namen eines/r Duellanten/in geklickt wird. Die Anzeige sieht zurzeit noch so aus:
Bild
Oben im Eingabefenster wird der vom schnellsten Kandidaten angegebene Wert eingegeben, und dann erst beim Klick auf den entsprechenden Namen ausgewertet. Wenn die Eingabe richtig ist, bekommt er/sie einen Punkt, wenn nicht einen halben Punkt Abzug. Ich muss also das Eingabefeld auslesen und die ID des/der Kandidaten/in übergeben. Der entsprechende Ausschnitt des Templates sieht so aus:

Code: Alles auswählen

...
                    <form action="{% url 'duell_kontrolle' gruppe_id kategorie.slug %}" method="post">
                        {% csrf_token %}
                        <fieldset>
                            {{frage}}
                            {{form.eingabe}}
                            {{einheit}}
                            <p></p>
                            <table>
                            <table>
                                <tr>
                                    <td><input type="submit" id="Eins" name = "duellant" value={{duellant_1.name}} class = {{duellant_1.liga}} ></td>
                                    <td>{{duellant_1.punkte_spiel}}</td>
...
                                </tr>
                                <tr>
                                    <td><input type="submit" value="gleich schnell" style = "background-color: #FFDEAD;"></td></tr>
                                <tr>
                                    <td><input type="submit" id="Zwei" name = "duellant" value={{duellant_2.name}} class = {{duellant_2.liga}} ></td>
                                    <td>{{duellant_2.punkte_spiel}}</td>
...
                                </tr>
                            </table>

                            </table>
                        </fieldset>
                    </form>
                    <script>
                        document.getElementById('eingabe').addEventListener('keypress', function(event) {
                            if (event.keyCode == 13) {
                                event.preventDefault();
                            }
                        });
                    </script>
                    <p></p>
                    <table>
                        <tr><td>
                            <button type="button">
                                <a style= "font-weight: bold;" href="{% url 'duell_aufgabe' gruppe_id kategorie.slug %}">nächste Aufgabe</a>
                            </button>
                        </td>
                        <td  style ="background-color: #FFB5C5;">Zeit</td>
                        <td>
                            <button type="button">
                                <a href="{% url 'duell_uebersicht' gruppe_id %}">Abbrechen</a>
                            </button>
                        </td></tr>
 ...
                    </table>
Im Internet habe ich diesen Teil innerhalb von <scrip> und </script> gefunden - das funktioniert nicht. Ich bin nicht sicher, ob das am Namen "document.getElementById('eingabe')" liegt. Im Objektinspektor wird "eingabe" als Namen angezeigt.

Re: Formular nicht bei Klick auf Eingabetaste auslesen

Verfasst: Mittwoch 24. Juli 2024, 17:52
von Sirius3
Ich verstehe die ganze Geschichte nicht. Du hast doch zwei Spieler, die jeweils für sich das Ergebnis der Aufgabe eingeben. Und bei der Eingabe ermittelst Du, wer schneller ist.
Was soll denn jetzt noch der Lehrer das selbe nochmal eingeben? Dein Programm kennt doch schon die Werte, und wer wie schnell war.

Re: Formular nicht bei Klick auf Eingabetaste auslesen

Verfasst: Mittwoch 24. Juli 2024, 18:00
von Pitwheazle
Nach dem Hinweis von @noisefloor:
noisefloor hat geschrieben: Mittwoch 3. Juli 2024, 17:54 das Problem hierbei ist die Latenz, wenn du das online machst. Sagen wir mal, es gehen wirklich an beide Clients die Aufgabe gleichzeitig raus - dann heißt das nicht, dass die gleichzeitig ankommen. Du hast ja eine Netzwerklatenz, auf die du null Einfluss hast. Die kann halt gering sein oder erheblich. Also das beide gleichzeitig die Aufgabe gleichzeitig sehen und gleichzeitig antworten (können) ist extrem unwahrscheinlich.
... habe ich die Idee verworfen, dass die Kids ihr Ergebnis selbst eintippen.
Pitwheazle hat geschrieben: Donnerstag 4. Juli 2024, 10:39 Bei meiner Idee wäre der Beamer und die Installation von OpenOffice überflüssig. Auch das Reinrufen und das Eintippen des reingerufenen Ergebnisses empfand ich als nicht optimal. Es stimmt aber, dass das Klicken auf Handys den Wettkampfcharakter einschränkt. Aber jetzt wo ich das schreibe, habe ich eine andere Idee: Es wäre ja eine Möglichkeit, den Rechentrainer so in meine App zu integrieren, dass die Lehrkraft die entsprechende Grafik vom Tablett oder PC mit dem Beamer projeziert und dadurch die OpenOffice Installation (die für viele ein Problem ist) wegfällt.

Entschudige, dass ich das in diesem Post nicht erwähnt habe.

Re: Formular nicht bei Klick auf Eingabetaste auslesen

Verfasst: Mittwoch 24. Juli 2024, 18:09
von noisefloor
Hallo,

im gezeigten Code gibt es kein HTML Element mit der ID "eingabe". Folglich bleibt der Eventlistener auch wirkungslos, weil der an nichts gebunden ist.

Gruß, noisefloor

Re: Formular nicht bei Klick auf Eingabetaste auslesen

Verfasst: Mittwoch 24. Juli 2024, 18:24
von Sirius3
@noisefloor: das verbirgt sich hinter {{form.eingabe}}.

@Pitwheazle: naja, Latenz wirst Du in einem Klassenzimmer nicht merken.
Also rufen die Kinder ihr Ergebnis rein und der Lehrer tippt ein.

Re: Formular nicht bei Klick auf Eingabetaste auslesen

Verfasst: Mittwoch 24. Juli 2024, 18:31
von snafu
Das Problem mit der Latenz könnte man doch so lösen: Beide Spieler fordern die neue Aufgabe an. Beide Clients geben dann automatisiert ihr Okay an den Server zurück, wenn die Aufgabe vollständig geladen ist. Der Server gibt anschließend für beide gleichzeitig das Go. Das heißt, vorher muss der schnellere Client mehr oder weniger lange auf den langsameren Client warten. Und dann wird lokal die Zeit zum Lösen der Aufgabe gemessen und das Ergebnis sowie die Dauer an den Server übermittelt.

Re: Formular nicht bei Klick auf Eingabetaste auslesen

Verfasst: Mittwoch 24. Juli 2024, 19:27
von Pitwheazle
Sirius3 hat geschrieben: Mittwoch 24. Juli 2024, 18:24 @Pitwheazle: naja, Latenz wirst Du in einem Klassenzimmer nicht merken.
Also rufen die Kinder ihr Ergebnis rein und der Lehrer tippt ein.
Ei ja, das wäre der Wettkampfcharakter
snafu hat geschrieben: Mittwoch 24. Juli 2024, 18:31 Das Problem mit der Latenz könnte man doch so lösen: Beide Spieler fordern die neue Aufgabe an. Beide Clients geben dann automatisiert ihr Okay an den Server zurück, wenn die Aufgabe vollständig geladen ist. Der Server gibt anschließend für beide gleichzeitig das Go. Das heißt, vorher muss der schnellere Client mehr oder weniger lange auf den langsameren Client warten. Und dann wird lokal die Zeit zum Lösen der Aufgabe gemessen und das Ergebnis sowie die Dauer an den Server übermittelt.
Ich fürchte, das überfordert mich - ich galube ich lasse das jetzt so mit wettkampfmäßigem Reinrufen.

Re: Formular nicht bei Klick auf Eingabetaste auslesen

Verfasst: Mittwoch 24. Juli 2024, 19:28
von Pitwheazle
... Aber mein ursprüngliches Problem ist noch nicht gelöst :(

Re: Formular nicht bei Klick auf Eingabetaste auslesen

Verfasst: Mittwoch 24. Juli 2024, 19:54
von Sirius3
Nun, wie heißt denn Dein Eingabefeld nun? Was steht im HTML-Code?

Re: Formular nicht bei Klick auf Eingabetaste auslesen

Verfasst: Mittwoch 24. Juli 2024, 19:59
von Pitwheazle
"name = "eingabe"
Bild

Re: Formular nicht bei Klick auf Eingabetaste auslesen

Verfasst: Mittwoch 24. Juli 2024, 20:15
von Sirius3
Da steht ja auch, dass die ID "id_eingabe" ist. Natürlich wäre es besser, nicht die ID zu benutzen, die ja scheinbar nicht exakt dem Namen entspricht, sondern - Überraschung - den Namen:

Code: Alles auswählen

document.querySelector('input[name=eingabe]').addEventListener('keypress', event => {
    if (event.keyCode == 13) {
        event.preventDefault();
    }
}); 

Re: Formular nicht bei Klick auf Eingabetaste auslesen

Verfasst: Mittwoch 24. Juli 2024, 20:17
von Pitwheazle
Mann, Mann, Mann!

Re: Formular nicht bei Klick auf Eingabetaste auslesen

Verfasst: Mittwoch 24. Juli 2024, 20:26
von grubenfox
Sirius3 hat geschrieben: Mittwoch 24. Juli 2024, 20:15 Natürlich wäre es besser, nicht die ID zu benutzen, die ja scheinbar nicht exakt dem Namen entspricht, sondern - Überraschung - den Namen:
Ist das so? Die ID sollte doch eigentlich, im Gegensatz zum Namen, ein-eindeutig sein und daher nur einmal im Dokument vorkommen. Während es theoretisch beliebig viele Elemente mit dem Namen 'eingabe' geben könnte.

Re: Formular nicht bei Klick auf Eingabetaste auslesen

Verfasst: Mittwoch 24. Juli 2024, 20:29
von Pitwheazle
Also zumindest funktioniert es jetzt.
Heißt das, ich sollte lieber anstelle von:

Code: Alles auswählen

document.getElementById('id_eingabe')
document.getElementByName('eingabe')
benutzen?

Re: Formular nicht bei Klick auf Eingabetaste auslesen

Verfasst: Mittwoch 24. Juli 2024, 20:36
von grubenfox
also ich bin da eher für die ID
(und von getElementByName hat hier niemand etwas geschrieben)

Re: Formular nicht bei Klick auf Eingabetaste auslesen

Verfasst: Mittwoch 24. Juli 2024, 21:14
von Sirius3
grubenfox hat geschrieben: Mittwoch 24. Juli 2024, 20:26Die ID sollte doch eigentlich, im Gegensatz zum Namen, ein-eindeutig sein
Theoretisch ja, praktisch nein. HTML setzt das nicht strikt durch.

Re: Formular nicht bei Klick auf Eingabetaste auslesen

Verfasst: Mittwoch 24. Juli 2024, 21:45
von __blackjack__
Praktisch auch ja wenn man selbst die Anwendung schreibt. Wenn die ID da nicht eindeutig ist, sollte man doch diesen Fehler beheben.

Re: Formular nicht bei Klick auf Eingabetaste auslesen

Verfasst: Mittwoch 24. Juli 2024, 21:54
von Pitwheazle
Ei, dann lassen wir das doch so. Danke mal wieder!