OnComplete not firing?

kevster76

Hi All,

Uploadify is fantastic - and I'm 99% there... I just have a small teething issue!

When a larger file is uploaded, there is a delay between the upload progress as showing as 100%, and the file actually landing in the correct directory. This an be a problem if the user submits the form as soon as the progress shows as 100%.

To get around this, I wanted to add an onComplete function to tell the user when the file has actually successfully been uploaded, but this doesn't seem to fire (probably due to my code!).

Here's what I'm doing:


$('#uploadSource1').fileUpload({
    'uploader':     'uploader.swf',
    'script':       'adm-upload.php',
    'folder':       'uploads/tmp-upload',
    'cancelImg':    'images/cancel.png',
    'displayData':  'percentage',
    'scriptData':   { 'filePrepend' : $('#submitTime').val() + '-1' },
    onSelectOnce: function() { $('#uploadOptions1').show(); },
    onCancel: function() { $('#uploadOptions1').hide(); },
    onClearQueue: function() { $('#uploadOptions1').hide(); },
    onAllComplete: function(event, data) {
        $(\"#uploadOptions1\").hide();
        alert(\"OAC\");
    },
    onError: function(event, queueID, fileObj, errorObj) {
        alert(\"OE\");
        alert(errorObj);
    }
});

I've tried lots of different things (in quotes, not in quotes, onAllComplete, onComplete) and nothing has worked for me! I'm by no means a jQuery expert, so it might be something pretty obvious that I've missed. I have been searching for a couple of hours now though with no luck!

Thanks in advance for your help!

Cheers,
Kev

emperor_trajan

Hey Kev, nice name btw

Have you tried removing the jquery code above your alert to make sure that the Javascript isn't crashing before that point? Maybe try something like:

$('#uploadSource1').fileUpload({
    'uploader':     'uploader.swf',
    'script':       'adm-upload.php',
    'folder':       'uploads/tmp-upload',
    'cancelImg':    'images/cancel.png',
    'displayData':  'percentage',
    'scriptData':   { 'filePrepend' : $('#submitTime').val() + '-1' },
    onSelectOnce: function() { $('#uploadOptions1').show(); },
    onCancel: function() { $('#uploadOptions1').hide(); },
    onClearQueue: function() { $('#uploadOptions1').hide(); },
    onAllComplete: function(event, data) {
         alert(\"OAC\");
    }
});

Sometimes it helps me to work backwards and remove as many of the things that "might" be causing the problem as possible.

kevster76

Hi,

Thanks for the quick response!

I'd tried so many things I've forgotten what they all are, but just copied and replaced with your code and ran it, and nothing seems to happen!

Any other ideas?

Many thanks,
Kev

Edited: I meant 'nothing' seems to happen instead of 'something'! D'Oh!

TravisN.

You see the progress bar get to 100% and then sit there because, you are actually sending the file to flash and it then sends the file to your tmp directory on your server. Once it finishes sending the file to the tmp directory it then passes control to the upload script. Flash doesn't know what your server is doing or what stage it is up to. This means your progress bar will sit at 100% until the upload script has finished processing.

I see your using your own upload script. Make sure at the end of your upload script you echo some form of data. It can be anything. In our examples we echo "1", but it can be the filename, "success", anything. Flash sometimes wont trigger the onComplete routine unless it receives something back from the upload script.

Make sense really. How else will flash know when your server has finished processing the file it sends to it.

kevster76

Perfect - thanks Travis.

I've renamed the file (for my purposes) but had used the one provided. I'd obviously removed the echo statement or something.

Added back in, it works a treat - thank you!!

Cheers,
Kev

Hollister

Please update the onComplete documentation to mention that *something* must be returned from the server to trigger this event. Evidently, just a 200 OK header is not sufficient; some sort of data must be returned.

TIA

Gaveen

I'm having a similar issue... onComplete is not firing. I'm uploading directly to S3. The upload reaches 100% and the queue entry removes itself fine but onComplete never fires.

Amazon returns some xml describing the uploaded file, so the above blank return shouldn't be causing this :\

Any ideas are welcome!

Here's the js


$(document).ready(function() {
  $('#uploadify4').uploadify({
    'auto':         true,
    'uploader':     'http://example.s3.amazonaws.com/',
    'swf':          '/swf/uploadify.swf',
    'cancelImage':  '/assets/uploadify-cancel.png',
    'postData':     {"key":"upload/${filename}","AWSAccessKeyId":"AKIAJWMJVLROOXFNY46A","acl":"public-read","policy":"ewogICAgICAnZXhwaXJhdGlvbic6ICcyMDExLTA3LTIyVDA5OjM1OjQzLjAwMFonLAogICAgICAnY29uZGl0aW9ucyc6IFsKICAgICAgICB7J2J1Y2tldCc6ICd3aWNrZWRiMmItZGV2J30sCiAgICAgICAgWydzdGFydHMtd2l0aCcsICckZmlsZW5hbWUnLCAnJyBdLAogICAgICAgIFsnc3RhcnRzLXdpdGgnLCAnJGtleScsICd1cGxvYWQnXSwKICAgICAgICB7J2FjbCc6ICdwdWJsaWMtcmVhZCd9LAogICAgICAgIHsnc3VjY2Vzc19hY3Rpb25fc3RhdHVzJzogJzIwMSd9LAogICAgICAgIFsnY29udGVudC1sZW5ndGgtcmFuZ2UnLCAwLCAyMTQ3NDgzNjQ4XSwKICAgICAgXQogICAgfQ==","signature":"pB9eR+uKyG/Yp2m3m6KNswD5pN4=","success_action_status":201},
    'fileObjName':  'file',
    'multi':        true,
    'onComplete'  : function(event, ID, fileObj, response, data) {
      alert('There are ' + data.fileCount + ' files remaining in the queue.');
    }
  });
});

bccsergio

@Gaveen: looking into your code, i see you´re using uploadify 3 ('swf' option)... in uploadify 3 there is no onComplete event... events list have changed... i made a little documentation with some adjustments, you can take a look here:

http://www.uploadify.com/forums/discussion/7597/uploadify-3-with-new-features-corrections-and-documentation

[]´s

Gaveen

Ya, I had just had a look through the source and discovered this... I probably should have realized it sooner :\

Thanks!

Gaveen

dupe.

bhavin

hi All,

I am new to uploadify and i am using jquery-1.3.2.min.js and jquery.uploadify.v2.1.0.min.js. my control is working good and it save the image.
but after uploaded image i want to display message and refresh the page but onComplete property is not firing. here is the code.

$("#<%=FileUpload1.ClientID%>").uploadify({

'uploader' : 'js/scripts/uploadify.swf',
'script' : 'Upload.ashx?MemberID='+ MID,
'cancelImg' : 'images/cancel.jpg',
'buttonText' : 'Change Photo',

'folder' : 'uploads',
'multi' : true,
'auto' : true,
'onComplete': function () {
alert(' files were successfully uploaded.');}

});

any idea how it's work!!!
Thanks..

Howdy, Stranger!

Categories