Sie sind hier: Startseite -> HTML-Grundlagen -> Formulare -> Datei hochladen

HTML-Grundlagen: File hochladen mit Formular

Fileupload: Formularfeld zum Durchsuchen

Eine weitere Option, die das input-Feld für die Formulare unter HTML anbietet, ist die Möglichkeit, eine Datei hochzuladen. Diesmal wird die Daten nicht auf den eigenen Server per FTP hochgeladen, damit man sie im Internet nützen kann, sondern man lädt eine Datei auf eine externe Webseite ergo deren Server.

ergibt:

Durch die Angabe des Typs File wird HTML mitgeteilt, dass hier eine Datei erwartet wird, wobei man die Spielregeln einengen kann. Für die Besucherinnen und Besucher der Webseite bedeutet dies, dass man auf Klick der Schaltfläche, die automatisch dargestellt wird, den eigenen Computer durchsuchen kann, um die richtige Datei anzugeben.

Hat man sich für eine Datei entschieden, dann steht der Pfad im Textfeld daneben und wird als Information mitgeschickt, sobald das Formular abgeschickt wird. Allerdings muss man als Formularanbieter darauf achten, dass das Formular als Multipart definiert ist, weil sonst das Formular zwar verschickt und verarbeitet wird, die Datei wird aber nicht akzeptiert, weil das an sich nicht üblich ist.

Erst durch die Angabe des Multipart-Formulares im form-Tag kann die Datei angenommen und verarbeitet werden. Dazu gibt es zwei weitere Einstellungen. Die erste betrifft die Größe der Datei, die man durch den Parameter maxlength begrenzen kann. Ist die Datei zu groß, wird sie nicht angenommen. Der zweite Parameter ist accept und bezieht sich auf die MIME-Typen, die die Dateien als solche erkennen. Im angeführten Beispiel werden nur Textdokumente akzeptiert. Würde man ein Video hochladen wollen, würde dieses als Video und damit als böse erkannt werden und es erfolgt die Ablehnung.

Ebenfalls interessant:

Formular (FORM)

Informationen über den FORM-Tag, mit dem ein Formular in eine Webseite eingebaut werden kann.

Checkbox

Informationen über die Checkboxen, die in Formulare eingebaut werden können.

Radiobutton

Informationen über den Radiobutton, der in HTML-Formulare für die Beantwortung genützt werden kann.

Schaltfläche

Informationen über die Schaltfläche, wie sie in Formularen programmiert wird.

Auswahlfeld

Informationen über die Auswahlliste mit Select, die bei HTML-Formularen oft genützt wird.

Auswahlfeld mehrfach

Informationen über die Auswahlliste mit select multiple, wodurch in HTML-Formulare eine Mehrfachauswahl möglich wird.

Textfeld

Informationen über das Textfeld, das in HTML-Formularen mit dem input-Tag erstellt werden kann und seine Parameter.

Mehrzeiliges Feld

Informationen über das mehrzeilige Textfeld in HTML-Formularen durch den textarea-Tag.

Verstecktes Feld

Informationen über das versteckte Formularfeld, das mit dem input-Tag unter HTML möglich wird, um interne Informationen einzubauen.

Schreibschutz

Informationen über den Schreibschutz bei Formularfelder in HTML-Formulare, der durch den Parameter readonly möglich wird.

[aktuelle Seite]

Datei hochladen

Informationen über die Möglichkeit, Dateien über ein Formular durch den Type File des input-Tags hochzuladen.

Beschriftung

Informationen über den Label-Tag für die Beschriftung von HTML-Formularfelder und zur Formatierung mit CSS bzw. als Hilfe für barrierefreie Formulare.

Zurück zum Hauptthema

Übersicht Formulare

Startseite HTML-Grundlagen