从mini-upload-form返回新文件名

Question

I'm using Mini AJAX Upload Form to upload files to a server. I modified the upload code to add a time stamp the the end of the file. How can I return the new name of the file (with the time stamp) to the client for later use?

date_default_timezone_set('America/New_York'); 
$date = date('.YmdHis');
// A list of permitted file extensions
$allowed = array('sqlite', 'db', 'db3');
if(isset($_FILES['upl']) && $_FILES['upl']['error'] == 0){

    $extension = pathinfo($_FILES['upl']['name'], PATHINFO_EXTENSION);

    if(!in_array(strtolower($extension), $allowed)){
            echo '{"status":"error"}';
            exit;
    }

    $file =  '/var/www/html/uploads/'.$_FILES['upl']['name'].$date;

    if(move_uploaded_file($_FILES['upl']['tmp_name'], $file)){
            echo '{"status":"success"}';
            exit;
    }
}
echo '{"status":"error"}';
exit;

JS:

$(function(){

 $('#drop a').click(function(){
    // Simulate a click on the file input button
    // to show the file browser dialog
    $(this).parent().find('input').click();
 });

 // Initialize the jQuery File Upload plugin
 $('#upload').fileupload({

    url: 'includes/php/upload.php',

    // This element will accept file drag/drop uploading
    dropZone: $('#drop'),
 });

 // Prevent the default action when a file is dropped on the window
 $(document).on('drop dragover', function (e) {
    e.preventDefault();
 });
});

HTML snippet:

<div class="row">
 <div class="col-lg-12 text-center">
  <form id="upload" method="post" enctype="multipart/form-data">
   <div id="drop">
    <p>Drop Database Here</p>
    <a>Browse</a>
    <input type="file" name="upl" multiple/>
   </div>
  </form>
 </div>
</div>

NOTE: Mini AJAX Upload Form uses jQuery-File-Upload

Answer 1

you can use the done call back to get he file name after upload it, of course you need to write it back to your ajax in you php script

done: function (e, data) {
            $("tr:has(td)").remove();
            $.each(data.result, function (index, file) {

                $("#uploaded-files").append(
                        $('<tr/>')
                        .append($('<td/>').text(file.fileName))
                        .append($('<td/>').text(file.fileSize))
                        .append($('<td/>').text(file.fileType))
                        .append($('<td/>').html("<a href='upload?f="+index+"'>Click</a>"))
                        .append($('<td/>').text("@"+file.twitter))

                        )//end $("#uploaded-files").append()
            }); 
        },

also this example is java example but they do similar thing to what you do http://hmkcode.com/java-servlet-jquery-file-upload/