Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery.form uploadProgress never called
    text
    copied!<p>I'm trying to write a WordPress plugin that uploads a video using the Vimeo API. I am trying to provide a progress bar for the upload to the user can see that it is working. To produce the status bar I am using the jQuery.Form plugin and accessing the uploadProgress callback but I cannot get the callback to fire. I am using Chrome 19 so the upload and file API's should be available to the browser.</p> <p>I have been copying the code from the jQuery.Form demo, which works on their page but has no effect on mine. - <a href="http://jquery.malsup.com/form/progress.html" rel="nofollow">http://jquery.malsup.com/form/progress.html</a></p> <p>The little Chrom notification in the bottom left of the screen is showing the upload percentage so I am confident that the file is being sent.</p> <p>Thoughts?</p> <pre><code> &lt;form method="POST" action="&lt;?php echo $endpoint; ?&gt;" id="vimeo_upload_form" enctype="multipart/form-data"&gt; &lt;p&gt; &lt;label&gt;Upload video to Vimeo&lt;/label&gt; &lt;input type="hidden" name="ticket_id" value="&lt;?php echo $token; ?&gt;" id="ticket_id"/&gt; &lt;input type="hidden" name="chunk_id" value="0" id="chunk_id"/&gt; &lt;input type="file" name="file_data" id="file_data"/&gt; &lt;/p&gt; &lt;p&gt; &lt;input type="submit" name="" value="upload"&gt; &lt;/p&gt; &lt;/form&gt; jQuery(document).ready(function($) { status_msg = $("#status_msg") console.log(status_msg) percent = $("#percentage") bar = $("#bar") $('#vimeo_upload_form').ajaxForm({ beforeSend: function() { status_msg.empty(); var percentVal = '0%'; bar.width(percentVal) percent.html(percentVal); }, uploadProgress: function(event, position, total, percentComplete) { var percentVal = percentComplete + '%'; bar.width(percentVal) percent.html(percentVal); }, complete: function(xhr) { status_msg.html(xhr.responseText); } }); }); </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload