LU06c - Button

siehe auch selfhtml - Buttons

Ein Button löst eine Aktion bzw. Verarbeitung aus. Das Button-Element benötigt das Attribut type um die Art der Verarbeitung zu definieren.

...
  <form action="./index.php" method="post">
    <label for="email">Email</label>
    <input id="email" name="email" type="text" />
    <button type="submit">Absenden</button>
  </form>
...

Klickt der Benutzer auf einen Button mit type=„submit“ , so sendet der Webbrowser die Formulardaten an die Zieladresse. Dabei müssen Sie beachten:

• Der Button muss innerhalb eines form-Elements stehen, andernfalls wird keine Verarbeitung ausgelöst.
• Die HTTP-Methode und Zieladresse werden im form-Tag definiert.
• Falls Sie mehrere Formulare in einer Webseite haben, muss jedes Formular einen eigenen <button type=„submit“ … haben.

...
  <form action='./index.php' method='post'>
    <label for='email'>Email</label>
    <input id='email' name='email' type='text' />
    <button type='submit'>Absenden</button>
    <button type='reset'>Zurücksetzen</button>
  </form>
...

Ein Button mit type='reset' setzt das Formular zurück. Alle Eingaben des Benutzers in den Eingabefeldern werden rückgängig gemacht. Es findet keine Übertragung der Daten an den Server statt.

Der Vollständigkeit halber soll auch dieser Type erwähnt werden. Mit diesem type definieren wir einen Button, der eine clientseitige Verarbeitung auslöst. Diese Verarbeitung müssen wir mit Javascript selber programmieren, was nicht Teil unseres Moduls ist.

Kevin Maurizi, Marcel Suter