0

I'm putting together a small HTML page that allows the user to upload files from his local device to the server. I'm using an approach that I found recommended in several places, which goes like this:

<FORM method="post" action="upload.py" enctype="multipart/form-data">
   <INPUT type="file" name="rhythm-file">
   <INPUT type="submit">
</FORM>

This works, but it takes the user away from the page to upload.py. How can I stay on the page? I tried using action="upload()" to call a JavaScript function, with the idea of calling an asynchronous HTTP request from there, but then the browser tries to navigate to cgi-bin/upload(). I also considered modifying upload.py to redirect back to the previous page, but that just doesn't feel like the correct way to do it.

Dabbler
  • 9,733
  • 5
  • 41
  • 64
  • 1
    upload file with Ajax maybe? [jQuery ajax file upload](https://stackoverflow.com/questions/2320069/jquery-ajax-file-upload) –  Oct 15 '17 at 12:40
  • 1
    the common way to do it is to redirect back from the script to your page. like you said yourself. But a more elegant way would be to use ajax and php – FutureCake Oct 15 '17 at 12:47

1 Answers1

0

You can use AJAX for this. There are many libraries to help you upload files via AJAX.

Here are a few Jquery Plugins: https://www.sitepoint.com/10-jquery-file-uploads/

Take a look at Dropzone, it has great documentation.

The file will be uploaded by dropzone asynchronously therefore the user will not be taken away from the page.

Rick Sanchez
  • 26
  • 4