+- Hack Forums (https://hackforums.net)
+-- Forum: Tech (https://hackforums.net/forumdisplay.php?fid=444)
+--- Forum: Webmasters (https://hackforums.net/forumdisplay.php?fid=141)
+---- Forum: Website Construction (https://hackforums.net/forumdisplay.php?fid=50)
+---- Thread: Drag and Drop files uploading error (/showthread.php?tid=3802703)
Drag and Drop files uploading error - facebokkiller - Oct 13, 2013
i watched many links on internet and also reffered to each and every question related to this topic but none helped! so plz any1 check this code and tell me where i'm doing wrong?
html code:
PHP Code
<?php
<div class="drop_zone">
<p>Drop Here</p>
</div>
<form enctype="multipart/form-data" id="yourregularuploadformId">
<input type="file" name="files[]" multiple="multiple">
</form>
jQuery and javascript code:
Code
function handleFiles(droppedFiles) {
var uploadFormData = new FormData($("#yourregularuploadformId")[0]);
if(droppedFiles.length > 0) { // checks if any files were dropped
for(var f = 0; f < droppedFiles.length; f++) { // for-loop for each file dropped
alert(droppedFiles[f]['name']);
uploadFormData.append("files[]",droppedFiles[f]); // adding every file to the form so you could upload multiple files
}
}
// the final ajax call
alert(uploadFormData);
$.ajax({
url : "try.php", // use your target
type : "POST",
data : uploadFormData,
cache : false,
contentType : false,
processData : false,
success : function(ret) {
alert(ret);
}
});
return false;
}
$(document).ready(function() {
//alert("im in");
$('.drop_zone').bind("dragenter", function(e) {
// $('#StatusDrag').html('Drop The files Here...');
});
$('.drop_zone').bind("dragleave", function(e) {
// $('#StatusDrag').html('Drag and Drop Files Here to Share');
});
$('.drop_zone').bind("dragover", function(e) {
e.preventDefault();
return false;
});
$('.drop_zone').bind("drop", function(e) {
e.preventDefault();
e.stopPropagation();
e.originalEvent.preventDefault();
e.originalEvent.stopPropagation();
// $('#dragBox, #topDiv').hide();
var dt = e.originalEvent.dataTransfer;
var files = dt.files;
handleFiles(files);
});
});php code:
PHP Code
<?php
if(isset($_FILES["files"]))
{
foreach ($_FILES["files"] as $file)
echo $file['name'];
}
?>