3

On a our website, we have a form which allows visitors to upload files to a different site on another server. (That site then redirects immediately back to us, so this is completely transparent to the user.)

<form method="POST" id="online_show_upload" class="online_show_upload upload_video" enctype="multipart/form-data" action="https://example.com/upload">
<label id="uploadlabel" for="upload_file">Upload File</label>
<input type="file" name="file_data" id="upload_file">
<input type="submit" value="Upload Now">
</form>

Obviously, our server knows nothing about the upload progress, but the user's browser does. Most browsers will display this as a percentage in the footer. Is there any way that javascript on our site can access that data so we can display a nice progress bar for large file uploads?

This is not an ajax form, and trying to search for anything to do with file uploads and javascript is not returning me useful results, because everything it shows is about ajax.

TRiG
  • 10,148
  • 7
  • 57
  • 107

2 Answers2

1

As mentioned here, you can use <iframe> as your form's target and read the contents of that <iframe> in its onload handler. That way you could try to start progress bar on submit and stop on response from submit.

This would be possible without AJAX but, as one of the comments there mentions, the submission action needs to be on the same site as the iframe or Same-Origin policy will block it.

For your particular scenario, it won't be possible without AJAX.

Tiago Martins Peres
  • 14,289
  • 18
  • 86
  • 145
0

The actual answer to your question is: no.

The onsubmit even is the latest point of contact with the form, once the submission is started the control is lost by javascript in the current page.

The submission of the form (which could mean "the upload of the file") is something in the hands of the browser, not of javascript; I don't know if some browsers has some ways to access data you are speaking about from the javascript in the submitting page, but if yes it is something not cross browser at all.

I'd seriously thinking to upgrade the HTML form to an ajax call.

Daniele Ricci
  • 15,422
  • 1
  • 27
  • 55