0

This could be a limitation of the environment but what I am trying to do is drop a file then have it post a file direct to the server PHP (no Ajax)... but the $_FILES variable is not correctly populated... Method: as the drop occurs the file object is taken and appended to a form which is submitted... This is normally done using and append to Ajax, but this creates an extra process that I don't want or need...

function uploadFile(e) {

  file_obj = e.dataTransfer.files[0];

  uploadForm = document.getElementById("upload_form");

  // Add the input to the form
  uploadForm.append('file', file_obj);

  // Add the form to dom
  document.body.appendChild(uploadForm);

  // Just submit
  uploadForm.submit();


}
<form action="upload.php" id="upload_form" enctype="multipart/form-data" method="post">
<div id="drop_file_zone" ondrop="uploadFile(event)" ondragover="return false">
   <p>Drop file here</p>
   <input name="" type="submit">     
</div>
</form>
jxwd
  • 179
  • 2
  • 6
  • 1
    Have you tried converting your file's data (text or binary) and converting it to a dataURL string and then using that dataURL to send to your form as a query argument? Might not work for large files. – moredrowsy Jun 11 '21 at 15:45
  • I am fairly new to javascript how would i do this? lots of these form interaction things seem to be done asynchronously (waiting for an event) I think the root is timing or just things aren't hooked up to work this way? – jxwd Jun 12 '21 at 19:09
  • You can try this, this is more straightforward then doing the text conversion: https://stackoverflow.com/questions/5628011/how-to-upload-a-file-to-my-server-using-html – moredrowsy Jun 13 '21 at 18:16

1 Answers1

-1

You should try new FormData() in order to get files data.

  • Good advice, but could be better if you show how to do it with an example – Saul Uribe Mar 07 '23 at 19:41
  • As it’s currently written, your answer is unclear. Please [edit] to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Mar 08 '23 at 08:33