1. Form Input Data:
---------------------
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title> Multi Upload Vanilla Javascript </title>
<script>
function uploadFiles() {
var formdata = new FormData();
var file = document.getElementsByName("filegroup")[0].files;
for (var i = 0; i < file.length; i++) {
formdata.append("data"+i, file[i]);
}
var ajax = new XMLHttpRequest();
ajax.open("POST", "upload.php");
ajax.onreadystatechange = function () {
if (ajax.readyState == 4 && ajax.status == 200) {
var resp = ajax.responseText;
console.log(resp);
}
}
ajax.send(formdata);
}
</script>
</head>
<body>
<form method="post" enctype="multipart/form-data">
<input type="file" name="filegroup" multiple />
<input type="button" value="Upload" onclick="uploadFiles()" />
</form>
</body>
</html>
-----------------------
2. Upload Proses
-----------------------
<?php
$file = $_FILES;
$jumlah = count($file);
$list_file = array();
for($i=0; $i<$jumlah;$i++){
$list_file[] = $file['data'.$i]['name'];
move_uploaded_file($file['data'.$i]['tmp_name'], "upload/".$file['data'.$i]['name']);
//bisa lansung di input ke DB di dalam Looping ini
}
echo json_encode($list_file);
?>