lang/js/ DragAndDropFiles
Drag and drop for multiple files, summarised from this article at artisansweb.
Javascript
function upload_file(e) {
e.preventDefault();
ajax_file_upload(e.dataTransfer.files);
}
function file_explorer() {
document.getElementById('selectfile').click();
document.getElementById('selectfile').onchange = function () {
files = document.getElementById('selectfile').files;
ajax_file_upload(files);
};
}
function ajax_file_upload(files_obj) {
if (files_obj != undefined) {
var form_data = new FormData();
for (i = 0; i < files_obj.length; i++) {
form_data.append('file[]', files_obj[i]);
}
var xhttp = new XMLHttpRequest();
xhttp.open("POST", "ajax.php", true);
xhttp.onload = function (event) {
if (xhttp.status == 200) {
alert(this.responseText);
} else {
alert("Error " + xhttp.status + " occurred when trying to upload your file.");
}
}
xhttp.send(form_data);
}
}
Php
<?php
if (!file_exists('uploads')) {
mkdir('uploads', 0777);
}
foreach ($_FILES['file']['name'] as $key=>$val) {
$filename = uniqid().'_'.$_FILES['file']['name'][$key];
move_uploaded_file($_FILES['file']['tmp_name'][$key], 'uploads/'.$filename);
}
echo "File(s) uploaded successfully.";
die;