Search code examples
jqueryfindstatusplupload

How to find and modify a queued element in Plupload with Jquery?

I am currently using plupload to upload directly to S3. It works great and what I'm trying to do is once an image is uploaded, initiate a script in which the image is then downloaded to create a thumbnail on my web server, thus limiting the amount of get request to my S3 account for thumbnails. While this is being done, I want the file name that is queued in the plupload widget to be updated to "FileName.jpg now is processing."

My problem is finding the element to update the text. This is what I have so far...

In the uploader setup:

init: attachCallbacks,

The function being called:

function attachCallbacks(uploader){
    uploader.bind('FileUploaded', function(up, file, response){
        $('tr#'+file.id).find('td:first').find('span').html(file.name+' is Now Processing...');
    });
}

Where I am trying to find and update:

<table id="uploader_filelist" class="plupload_filelist_content" unselectable="on">
<tbody>
<tr id="p170sanph11rqv1cnts6h1ujm1gnm3" class="plupload_done ui-state-default plupload_file">
<td class="plupload_cell plupload_file_name">
<span>FileName.jpg</span>
</td>
<td class="plupload_cell plupload_file_status">100%</td>
<td class="plupload_cell plupload_file_size">28 KB</td>
<td class="plupload_cell plupload_file_action">
</tr>
</tbody>
</table>

Any ideas???

Solution

  • I originally had asked this question because I was using Plupload's S3 example but wanted a custom UI. I ended up using plupload's custom example and combined it with their S3 example and everything works fine.