jQuery einfaches drag & drop upload Plugin
In diesem Tutorial möchte ich erklären wie das Plugin "jQuery simple drag & drop upload" funktioniert.
Als erstes downloaden wir das Script und entpacken die Files in einem Web-Server, z.B.: /var/www/simpleupload/
Das Verzeichnis SimpleUpload sollte folgende Verzeichnisse und Files enthalten:
Uploads in diesem Verzeichnis werden die Daten hochgeladen
css enthält das SimpleUpload.css
img enthält Layout Images
js enthält SimpleUpload.js und jquery.form.js Scripts
index.html initialisiert SimpleUpload.js und sendet die Daten via ajax an upload.php
upload.php lädt die Daten ins Verzeichnis Uploads hoch
Installation
Wir setzten die Schreibrechte des Verzeichnisses Upload auf 777
Wir öffnen die Datei index.html und passen SimpleUpload options an.
Nach der Anpassung der Optionen können wir mit dem Upload starten.
Simple Upload lässt sich durch folgende Optionen anpassen:
| URL | Definiert die Upload-File URL |
| FormName | Definiert den Simple Upload-Formnamen |
| FileFieldName | Definiert den File-Fieldnamen |
| Method | Definiert Form-Method |
| UploadDir | Definiert Upload-Directory |
| MaxFileUpload | Definiert wie viele Dateien hochgeladen werden können. |
| MaxFileSize | Definiert das Maximum an Dateiengröße in Bytes |
| AllowedExtensions | Definiert die erlaubten Extensions. |
| AllowRandomFilename | Erlaubt das Erzeugen von beliebigen Filenamen |
| MultipleUpload | Erlaubt das Hochladen von mehreren Dateien gleichzeitig |
| CustomFormData | Erlaubt das Verschicken von benutzerdefinierten Variablenz.B. Member-ID zum Upload-Script |
| AutoUpload | Erlaubt das Auto-Update nach dem Aussuchen der Dateien |
| onSuccess | Zeigt die Zurückgegebene json-call nach dem Upload |
