jQuery File Upload formData not updating

Question

I already read How to submit additional form data and it in fact works. But what I am trying to accomplish is to update the formData every time a chunk is sent, so the new data is sent to the server along with the chunk.

This is what I have tried:

$('#upload').fileupload({
    maxChunkSize: 100000, // 100KB
    formData: {UploadID: 'just testing'},
}).bind('fileuploadchunkdone', function (e, data) {
    UId = data.jqXHR.responseJSON.files[0].UploadId;
    console.log(UId); // Confirmed, it does have the data sent back by the server
    data.formData = {UploadID: UId}; // It updates, but doesn't send the new data
}).bind('fileuploadchunksend', function (e, data) {
    // tried the same here, but no luck
});

Using Firebug I can see the data sent to the server. The first chunk sends the formData correctly, but the second chunk sends the same data again.

I also tried what is described here by the author, but overriding the send handler doesn't work because it only happens on the first chunk.

Any idea how I can achieve this?

omma2289 · Accepted Answer · 2013-11-20 17:49:23Z

1

Haven't tested this but you may be able to define your UId variable in a greater scope and update it with every call:

var UId = 'just testing';  

$('#upload').fileupload({
    maxChunkSize: 100000, // 100KB
    formData: function(){
        return [{UploadID: UId}];
    }
}).bind('fileuploadchunkdone', function (e, data) {
    UId = data.jqXHR.responseJSON.files[0].UploadId;
});

edited Nov 20, 2013 at 17:49

answered Nov 19, 2013 at 18:45

omma2289

54.7k8 gold badges66 silver badges68 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

omma2289 Over a year ago

@rlcabral I have updated the code above, try setting the formData option as a function

rlcabral Over a year ago

Nop, it sends 'undefined', although UId is set. I tried sending only on the first chunk and also on every chunk. Same thing on any chunk. For now I will stick with data.data.append(). Ugly, but works.

rlcabral · Accepted Answer · 2013-11-19 20:55:21Z

Not sure if this is the right way to achieve this. But here is what I did:

var UId = 'just testing'; 

$('#upload').fileupload({
    maxChunkSize: 100000, // 100KB
    //formData: {UploadID: UId} REMOVED      
}).bind('fileuploadchunkdone', function (e, data) {
    // UId is set after the chunk is done
    UId = data.jqXHR.responseJSON.files[0].UploadId;
}).bind('fileuploadchunksend', function (e, data) {
    // and append UploadId
    // Yes, append, not override
    data.data.append('UploadId', UId);
    // This will also be fired on the first chunk upload
    // so it is better to set UId in a greater scope as koala_dev said
}

As I said, I don't know if this is right. But it worked.

Notice that I've removed formData: {UploadID: UId} from the initial setup. Keeping it there would make every chunk to send UploadID twice, first on the top of the chunk (before the file data) with an unchangeable value and then on the bottom of the chunk (after the file data) with the new value.

Collectives™ on Stack Overflow

jQuery File Upload formData not updating

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related