php - How to append file upload paths to a Form using JavaScript? -

below jquery/javascript code have handles file uploads on form have. user can upload many files need to, after upload file, show preview image of uploaded file in div.

what need with, need somehow add files uploaded, hidden form field when submit form, post file name/path of each file uploaded other form data backend php script.

i'm not sure on best way this?

i thinking might work...

<input type="text" name="uploads[]" id="uploads" value="file path here">

but i'm not sure if overwrite previous values each time new file added if there more 1 upload?

any ideas on how handle this? need access filename of each uploaded file in backend once form submitted.

jquery(function () {     jquery('#fileupload').fileupload({         url: '<?php echo mage::geturl('signwizard/index/savefile') ?>',         sequentialuploads: true,         datatype: 'json',         dropzone: jquery('#dropzone'),         pastezone: jquery(document),         autoupload: true,          done: function (e, data) {             jquery.each(data.result.files, function (index, file) {                 jquery('<div/>').html('<img src="/channeluploads/thumbnail/'+file.name+'"> '+file.name).appendto(jquery('#imagecontainer'));                   // add uploaded image path , name form field thatr file path posted when form submitted.....              });         }     }); }); 

to elaborate on comment, long append new input each file, go:

done: function (e, data) {     jquery.each(data.result.files, function (index, file) {          jquery('<div/>').html('<img src="/channeluploads/thumbnail/'+file.name+'"> '+file.name).appendto(jquery('#imagecontainer'));           jquery('#yourformid').append('input type="hidden" name="uploads[]" value="'+file.name+'">');       }); }