SELFHTML

Felder für Datei-Upload

Informationsseite

nach unten Felder für Datei-Uploads definieren
nach unten Weitere Informationen

 nach unten 

HTML 3.2XHTML 1.0MS IE 3.0Netscape 2.0Opera 5.12Mozilla Firefox 1Konqueror 3.1Safari 1.2 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:

Beispiel-Seite 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" 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).

Wenn Sie das Attribut maxlength angeben, sollte der Web-Browser die dahinter notierte Zahl als maximal erlaubte Dateigröße in Bytes interpretieren (maxlength = maximal length = maximale Länge). Im obigen Beispiel wird auf diese Weise die Bytezahl auf 100000 Byte begrenzt. Wenn Sie maxlength weglassen, kann der Anwender beliebig große Dateien senden. Beachten Sie jedoch, dass diese Angabe mit Vorsicht zu genießen ist. In der HTML-Version 3.2 wurde es so bestimmt, in der Version 4.0 wird diese Funktionalität beim maxlength-Attribut dagegen nicht mehr erwähnt. Verlassen Sie sich also nicht auf diese Angabe. Sicherer ist es, bei der Weiterverarbeitung mit einem CGI-Script im Script die Dateigröße zu ermitteln und das Script davon abhängig entscheiden zu lassen, ob die Datei akzeptiert oder verworfen wird.

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 Seite 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). Verlassen Sie sich aber auch bei dieser Angabe nicht darauf, dass der Browser das tatsächlich prüft vor dem Versenden des Formulars.

Beachten Sie:

Wichtig ist, dass Sie im einleitenden <form>-Tag die Angabe enctype="multipart/form-data" notieren, wenn das Formular ein Element für Datei-Upload enthält.

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

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

nach obennach unten

Weitere Informationen

In der Kapitel 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:
Seite Element-Referenz für Input-Formularelemente (<input>)
Seite Attribut-Referenz für Input-Formularelemente (<input>)

 nach oben
weiter Seite Versteckte Elemente
zurück Seite Auswahllisten, Radio-Buttons und Checkboxen
 

© 2005 Seite Impressum