Textbox

[Rolf B]

Hallo Lenhartz,

du schriebst anderswo:

Ich sitze gerade an einem kleinen Versuch: der Button ist zum Anfang deaktiviert und durch das richtige Wort in der Textbox soll er freigeschaltet werden. Ich benutze HTML und möchte das auch damit geregelt haben.Geht das und wenn ja hat jemand eine ergänzung parat?

<label for="bar"><b>Text</b></label>
      <input type="Text" placeholder="Text" name="bar" required pattern="Brokkoli">

      <button type="submit" disabled>Login</button>

DER BUTTON SOLL AKTIVIERT WERDEN WENN Brokkoli INS FELD EINGETRAGEN WIRD

Schrei nicht so 😉. Fettschrift erreichst Du durch Sternchen: **fett** ergibt fett

Das Aktivieren und Deaktivieren des Buttons erreichst Du nur mit JavaScript. Wenn Du es tatsächlich basierend auf der Pattern-Validierung steuern willst, musst Du die checkValidity Methode zur Prüfung verwenden

Wieviel JavaScript kannst Du?

Aber wie ich Dir schon schrieb: Das ist der falsche Weg. Überlass die Prüfung dem Server, verrate dem Anwender nicht während des Tippens ob er richtig liegt. Das ist ein Sicherheitsloch. Und das Passwort als Pattern abzulegen ist grober Unfug. Alles, was vom Server in den Browser geladen wird, kann vom Benutzer betrachtet und ggf. auch geändert werden.

Wie man den Login-Button aktiviert, wenn die Gültigkeitsregeln erfüllt sind, kannst Du Dir im verlinkten Fiddle angucken. Ich war vorhin im Irrtum, das Event heißt input, nicht change. Ich verwechsle die beiden ständig 😉

https://jsfiddle.net/Rolf_b/tjwbpL4c/

Wichtig ist: Der Button darf nicht durch HTML deaktiviert werden, sondern das muss das Script tun. Grund: Falls das Script nicht ausgeführt wird, würde der Button nie aktiv werden. Das nennt man progressive enhancement.

Rolf