SELFHTML: HTML/XHTML / Formulare / Felder für Datei-Upload

SELFHTML/Navigationshilfen HTML/XHTML Formulare
	Felder für Datei-Upload
	Felder für Datei-Uploads definieren Weitere Informationen

Felder für Datei-Upload definieren

Diese Sorte Formularelement erlaubt dem Anwender, eine Datei von seinem lokalen Rechner zusammen mit dem Formular zu übertragen. Wenn ein CGI-Script die ankommenden Formulardaten auf dem Server-Rechner verarbeitet, ist es dadurch möglich, dem Anwender das Uploaden (Hochladen) von Dateien auf den Server-Rechner zu ermöglichen.

Beispiel:

Anzeigebeispiel: So sieht's aus

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Felder f&uuml;r Datei-Upload definieren</title>
</head>
<body>

<h1>Schicken Sie uns was Schickes!</h1>

<form action="input_file.htm" method="post" enctype="multipart/form-data">
  <p>W&auml;hlen Sie eine Textdatei (txt, html usw.) von Ihrem Rechner aus:<br>
    <input name="Datei" type="file" size="50" maxlength="100000" accept="text/*">
  </p>
</form>

</body>
</html>

Erläuterung:

Mit <input type="file"> definieren Sie ein Element für Datei-Upload (input = Eingabe, file = Datei). Der Web-Browser sollte dann ein Eingabefeld anzeigen, das die Eingabe einer Datei (in den meisten Fällen mit Pfadnamen) erlaubt. Rechts daneben sollte der Browser einen Button anzeigen, bei dessen Anklicken ein lokaler Dateiauswahl-Dialog am Bildschirm erscheint. Die Größe des Eingabefeldes (Anzahl Zeichen) können Sie mit dem Attribut size bestimmen (size = Größe).

Das Attribut maxlength wurde in HTML 3.2 definiert als Hinweis an den Browser, nur Dateien bis zu einer Bytegröße dieser Angabe zur Auswahl zuzulassen. In HTML 4.01 wird auf diese Funktion nicht mehr eingegangen. Uns ist auch kein Browser bekannt, der diese Angabe in irgendeiner Weise einschränkend umsetzt.

Wenn Sie nur bestimmte Dateitypen zulassen wollen, können Sie mit der Angabe von accept die erlaubten Dateitypen eingrenzen (accept = akzeptieren). Hinter dem Istgleichzeichen können Sie einen MIME-Typ angeben. Dabei ist auch das Wildcard-Zeichen (*) bei Subtypen erlaubt. Im obigen Beispiel werden mit text/* alle Textdateien akzeptiert. Dazu gehören reine Textdateien (*.txt), aber z.B. auch HTML-Dateien (*.html,*.htm). Auch bei dieser Angabe ist uns kein Browser bekannt, der die Auswahl des Benutzers in irgendeiner Form kontrolliert.

Beachten Sie:

Datei-Uploads funktionieren nur mit method="post". Wichtig ist außerdem, dass Sie im einleitenden <form>-Tag die Angabe enctype="multipart/form-data" notieren. Andernfalls erhalten Sie lediglich den Dateinamen der ausgewählten Datei übermittelt, nicht jedoch die Datei selbst.

Im Online-Angebot von SELFHTML aktuell finden Sie einen Artikel, der beschreibt, wie das serverseitige Verarbeiten solcher Datei-Uploads aussehen kann:
Fileupload per Perl/CGI
Um das dort beschriebene CGI-Script zu verstehen, benötigen Sie allerdings Kenntnisse in Perl.

Das Attribut value in Verbindung mit <input type="file">, mit dem das Vorbelegen der Dateiauswahl möglich wäre, wird von aktuellen Browsern aus Sicherheitsgründen nicht unterstützt.

Weitere Informationen

In der HTML-Referenz finden Sie Angaben darüber, wo das hier beschriebene Formularelement vorkommen darf, welche Attribute erlaubt sind und was bei den einzelnen Attributen zu beachten ist:
Element-Referenz für Input-Formularelemente (<input>)
Attribut-Referenz für Input-Formularelemente (<input>)


	Versteckte Elemente
	Auswahllisten, Radio-Buttons und Checkboxen

SELFHTML/Navigationshilfen HTML/XHTML Formulare