Frage Post Formular

  • Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

rschmidt

Neues Mitglied
26 Januar 2017
6
0
1
24
Moin zusammen,

ich habe ein kleine Webanwendung, bei der ich mit mobilen Endgeräten QR Codes Scanne. Dazu nutze ich den html5 QR Codescanner (https://github.com/mebjas/html5-qrcode)
Das funktioniert auch wirklich gut.

Das entsprechende Formular sieht dazu so aus:
HTML:
<div class="content-block">
    <h3>Ticket Scannen</h3>
    <form action="" method="post" class="form responsive-width-100" id="ticketcodeform">
     <input type="text" id="ticketcode" name="ticketcode" placeholder="Ticket Code" class="form responsive-width-100" autofocus>
        <div id="qr-reader" style="width:80%" ></div>
        <div id="divbtnscanner" class="links" style="display: block;" >
            <a onclick="scanneraktivieren()">QR Code Scannen</a></a>
        </div>
    <input type="submit" name="submit" value="Erfassen">
    </form>
</div>
(am PC wird ein USB Barcodescanner verwendet, an den Handys kommt der HTML QR Code Scanner zum Einsatz. Der USB Barcodescanner sendet ein Enter und schickt damit das Formular automatisch ab)

wenn der Scan erfolgreich war, wird das Ergebnis in das Textfeld geschrieben:
Javascript:
function onScanSuccess(decodedText, decodedResult) {
            document.getElementById('ticketcode').value = `${decodedText}`;
            html5QrCode.clear();            
}

Jetzt soll das Formular aber auch gleich mit einem Erfolgreichen Scan abgeschickt werden (quasi der Click auf "Erfassen")
Dazu habe ich die JS Funktion wie folgt erweitert:
Javascript:
function onScanSuccess(decodedText, decodedResult) {
            document.getElementById('ticketcode').value = `${decodedText}`;
            html5QrCode.clear();
            document.getElementById("ticketcodeform").submit();
 }
Leider funktioniert das nicht. Auch das Log gibt keine Fehler aus.
Hat jemand eine Idee?

Vielen Dank vorab.
 

Sempervivum

Senior HTML'ler
18 Oktober 2016
2.475
474
83
68
Da muss man erst Mal drauf kommen aber der Debugger hat es an den Tag gebracht:
Wenn man so:
<input type="submit" name="submit" value="Erfassen">
einem Formularelement den Namen "submit" gibt ist dieses:
document.getElementById("ticketcodeform").submit
nicht mehr die Funktion submit sondern das Formularelement mit diesem Namen, also der Submitbutton. Ändere ich den Namen z. B. so:
<input type="submit" name="sbmt" value="Erfassen">
funktioniert das Abschicken durch Javascript mit der Funktion submit().
 
Zuletzt bearbeitet:

jonas3344

Aktives Mitglied
25 Oktober 2019
159
44
28
38
Wenn das Formular eh automatisch abgesendet werden soll braucht es den Submit-Button gar nicht mehr.
Ausserdem ist es heutzutage üblich das <button>-Element zu verwenden, anstelle von <input type="submit">.
 

rschmidt

Neues Mitglied
26 Januar 2017
6
0
1
24
Vielen Dank für die Hinwesie.

Jetzt funktionierts ;)

Da ich ggf auch Manuelle Eingaben habe, brauche ich schon noch den button ;)