HTML - Formulare: Unterschied zwischen den Versionen

Aus Flinkwiki
Wechseln zu: Navigation, Suche
(Die Seite wurde neu angelegt: „ __FORCETOC__ Siehe auch HTML#Formulare == Kontaktformular == === Grundgerüst === HTML-Datei: <nowiki> <!DOCTYPE html> <html> <head> <meta charset="UTF…“)
 
 
Zeile 1: Zeile 1:
−
 
+
<div align="right"><big>'''[https://flinkwiki.de/index.php?title=Kategorie:Alle_Seiten Seitenübersicht]'''</big></div>
  
 
__FORCETOC__
 
__FORCETOC__

Aktuelle Version vom 15. August 2020, 20:54 Uhr

Seitenübersicht


Siehe auch HTML#Formulare

Kontaktformular

Grundgerüst

HTML-Datei: 

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Formular-Test</title>
</head>
<body>
    <p>"Geben Sie Ihren Namen und die E-Mail-Adresse ein<br>
    und senden Sie dann die Daten ab."</p>
    <form action="input.php" method="post">
    <p><input name="vor">Vorname</input></p>
    <input name="nach">Nachname</input></p>
    <input type="submit">
    <input type = "reset">
</form>
</body>
</html>

PHP-Datei: 

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Formular-Test</title>
</head>
<body>
<?php
    echo "Guten Tag " . $_POST["vor"];
?>
</form>
</body>
</html>

Formularelemente

input

Eingabefeld: 

<input type="text" name="pseudo" value="Max21" />

name ist obligatorisch, value ist fakultativ (vorausgefüllt).

Für Passwörter verwendet man das Attribut 

type="password"

Die Eingabe ist dann nicht sichtbar.

Absenden: 

<input type="submit" value="Abschicken" />

value ist fakultativ.

Zurücksetzen: 

<input type="reset"  />

Texteingabe mit textarea

<textarea name="message" rows="8" cols="45">
 Hier kommt Ihr Text.
</textarea>

Für das PHP-Dokument wird die Variable $_POST['message'] erzeugt.

Dropdown-Liste

Es wird das Tag select verwendet: 

<select name="choix">
    <option value="choix1">Choix 1</option>
    <option value="choix2">Choix 2</option>
    <option value="choix3">Choix 3</option>
    <option value="choix4">Choix 4</option>
</select>

Ein Default-Wert wird folgendermaßen dargestellt: 

<option value="choix3" selected="selected">Choix 3</option>

Checkboxen

<input type="checkbox" name="case" id="case" /> <label for="case">Ma case à cocher</label>

label ist nicht zwingend erforderlich. Es verweise aber mit dem Attribut for auf die id der Checkbox. Mit name wird für PHP die Variable $_POST['case'] erzeugt (nur wenn das Kästchen angekreuzt ist).

Auch hier ist eine Vorbelegung (Default) möglich: 

<input type="checkbox" name="case" checked="checked" />

Radiobuttons

Aimez-vous les frites ?
<input type="radio" name="frites" value="oui" id="oui" checked="checked" /> <label for="oui">Oui</label>
<input type="radio" name="frites" value="non" id="non" /> <label for="non">Non</label>

Vorbelegung möglich mit checked="checked". Bei den Radiobuttons ist name identisch, die Variable wird aus dem Attribut value erzeugt.

Versteckte Felder

<input type="hidden" name="pseudo" value="Max21" />

Versteckte Felder sind notwendig, wenn man mit festen, unsichtbaren Werten Variablen erzeugen will.

Im Quellcode sind versteckte Felder sichtbar.



Sicherheit

htmlspecialchars

Die Funktion htmlspecialchars wandelt die spitzen Klammern von Tags <> in &lt; und &gt; um.

Dadurch wird verhindert, dass statt einer ordnungsgemäßen Eingabe ausführbarer Code an PHP übergeben wird:

Du heißt <?php echo htmlspecialchars($_POST['vorname']); ?> !

strip_tags

strip_tags entfernt HTML-Tags.

Sicherheitsoption httpOnly

Sicherheitsoption httpOnly setzen

Dateien hochladen

HTML-Formular

Dem Tag form muss das Attribut enctype="multipart/form-data" hinzugefügt und in das Formular das Tag <input type="file" /> eingefügt werden: 

<form action="cible_envoi.php" method="post" enctype="multipart/form-data">
        <p>
                Formulaire d'envoi de fichier :<br />
                <input type="file" name="monfichier" /><br />
                <input type="submit" value="Envoyer le fichier" />
        </p>
</form>

[1]

PHP-Code

Hier die oben im Code definierte Datei "cible_envoi.php": 

<?php

// Testons si le fichier a bien été envoyé et s'il n'y a pas d'erreur

if (isset($_FILES['monfichier']) AND $_FILES['monfichier']['error'] == 0)

{

        // Testons si le fichier n'est pas trop gros

        if ($_FILES['monfichier']['size'] <= 1000000)

        {

                // Testons si l'extension est autorisée

                $infosfichier = pathinfo($_FILES['monfichier']['name']);

                $extension_upload = $infosfichier['extension'];

                $extensions_autorisees = array('jpg', 'jpeg', 'gif', 'png');

                if (in_array($extension_upload, $extensions_autorisees))

                {

                        // On peut valider le fichier et le stocker définitivement

                        move_uploaded_file($_FILES['monfichier']['tmp_name'], 'uploads/' . basename($_FILES['monfichier']['name']));

                        echo "L'envoi a bien été effectué !";

                }

        }

}
?>

[2]

Weiterführendes Tutorial: https://openclassrooms.com/courses/upload-de-fichiers-par-formulaire

E-Mail versenden

<html>

   <head>
      <title>Sending HTML email using PHP</title>
   </head>

   <body>

      <?php
         $to = "xyz@somedomain.com";
         $subject = "This is subject";

         $message = "<b>This is HTML message.</b>";
         $message .= "<h1>This is headline.</h1>";

         $header = "From:abc@somedomain.com \r\n";
         $header .= "Cc:afgh@somedomain.com \r\n";
         $header .= "MIME-Version: 1.0\r\n";
         $header .= "Content-type: text/html\r\n";

         $retval = mail ($to,$subject,$message,$header);

         if( $retval == true ) {
            echo "Message sent successfully...";
         }else {
            echo "Message could not be sent...";
         }
      ?>

   </body>
</html>

Links

| |

Abgerufen von „https://flinkwiki.de/index.php?title=HTML_-_Formulare&oldid=1253“