Index.html
<html> <head> <title>Load files</title> <script src="jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $('#myfiles').on("change", function() { var myfiles = document.getElementById("myfiles"); var files = myfiles.files; var data = new FormData(); for (i = 0; i < files.length; i++) { data.append('file' + i, files[i]); } $.ajax({ url: 'load.php', type: 'POST', contentType: false, data: data, processdata: false, cache: false }).done(function(msg) { $("#loadedfiles").append(msg); }); }); }); </script> </head> <body> <div id="upload"> <div > <input id="myfiles" type="file" name="myfiles[]" multiple="multiple" /> </div> </div> <div id="loadedfiles"> </div> </body></html>load.php
<?php $path="myfiles/";//server path foreach ($_FILES as $key) { if($key['error'] == UPLOAD_ERR_OK ){ $name = $key['name']; $temp = $key['tmp_name']; $size= ($key['size'] / 1000)."Kb"; move_uploaded_file($temp, $path . $name); echo " <div> <h12><strong>File Name: $name</strong></h2><br /> <h12><strong>Size: $size</strong></h2><br /> <hr> </div> "; }else{ echo $key['error']; } }?>
