php - Dropzone.js - Display existing files on server -
i'm using dropzone.js v3.10.2 having issues displaying existing files have uploaded. more competent php have limited knowledge when comes ajax , js
if awesome
thanks in advance
index.php
<html> <head> <link href="css/dropzone.css" type="text/css" rel="stylesheet" /> <script src="ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script src="dropzone.min.js"></script> <script> dropzone.options.mydropzone = { init: function() { thisdropzone = this; $.get('upload.php', function(data) { $.each(data, function(key,value){ var mockfile = { name: value.name, size: value.size }; thisdropzone.options.addedfile.call(thisdropzone, mockfile); thisdropzone.options.thumbnail.call(thisdropzone, mockfile, "uploads/"+value.name); }); }); } }; </script> </head> <body> <form action="upload.php" class="dropzone" id="my-dropzone"></form> </body> upload.php
<?php $ds = directory_separator; $storefolder = 'uploads'; if (!empty($_files)) { $tempfile = $_files['file']['tmp_name']; $targetpath = dirname( __file__ ) . $ds. $storefolder . $ds; $targetfile = $targetpath. $_files['file']['name']; move_uploaded_file($tempfile,$targetfile); } else { $result = array(); $files = scandir($storefolder); //1 if ( false!==$files ) { foreach ( $files $file ) { if ( '.'!=$file && '..'!=$file) { //2 $obj['name'] = $file; $obj['size'] = filesize($storefolder.$ds.$file); $result[] = $obj; } } } header('content-type: text/json'); //3 header('content-type: application/json'); echo json_encode($result); } ?> ps. know php retrieving data
thanks in advance
damian
i checked code (from startutorial) , didn't work me either(?)
i managed working replacing this:
$.get('upload.php', function(data) { $.each(data, function(key,value) { var mockfile = { name: value.name, size: value.size }; thisdropzone.options.addedfile.call(thisdropzone, mockfile); thisdropzone.options.thumbnail.call(thisdropzone, mockfile, "uploads/"+value.name); }); }); with this:
$.getjson('files/list-all', function(data) { $.each(data, function(index, val) { var mockfile = { name: val.name, size: val.size }; thisdropzone.options.addedfile.call(thisdropzone, mockfile); thisdropzone.options.thumbnail.call(thisdropzone, mockfile, "uploads/" + val.name); }); }); credit answer: https://stackoverflow.com/a/5531883/984975
edit: in version 4.0 thumbnails of existing files showed cue bar in it. solve add:
thisdropzone.emit("complete", mockfile);
Comments
Post a Comment