Access to response data in fileuploaded event

[zebub]

Being able to send extra data from the server aside from errors would be useful.

[kartik-v]

For ajax uploads you can send it using uploadExtraData property (read docs) - to your uploadUrl. For form based uploads you can always send additional inputs to your FORM submission.

[zebub]

I may be misreading the docs then. As I understand it, the uploadExtraData property controls what additional data is sent to the server. It does not make any data sent from the server available in the fileuploaded event.

[kartik-v]

Yes you are right ... uploadExtraData controls what extra data you send to the server URL that processes the AJAX based upload. Is there any reason why you need this data within fileuploaded event?

[zebub]

For my specific case I'm performing some server side processing of images and archives and I need to show the result to the user for confirmation. This requires the client to know the new urls of the processed images.

Generally speaking I think there are more use cases where it is useful to be able to respond to data from the server after an upload.

It is of course possible to store the data and get it in another AJAX call, it would just be convenient to not have to make additional requests.

[kartik-v]

I understand - but all the more reason if you want to avoid further AJAX calls... you directly process everything you need in your server upload action as identified in uploadUrl - where you have all information about the files and the uploadExtraData.

You could display any calculated data based on this to the user in any separate div or alert box etc.

Is there any reason why you want this information again after the file is uploaded (that's when your fileuploaded event triggers)?

[kartik-v]

I am anyway noting an enhancement for ajax call to send back data to the client... but this may take a bit of time. Will keep the issue open.

[zebub]

If, for instance, an upload contains an archive with a file structure of images. These images need to be sorted a certain way and the images are cropped to fit a certain aspect ratio. After the archive has been decompressed and the containing images have been processed, the user must be shown how the images look and how they are sorted after having been processed by the server.

In this case, the response from the server would contain data about image sorting and urls to show the user.

[kartik-v]

Resolved via upgrade to release v4.1.2.

[zebub]

Wow that was fast!

I'm still not sure this resolved the issue I meant to describe though.

The response content from the server is a parameter in the AJAX success function and is, in the script, assigned to the data variable. It is currently used to allow the server to respond with error messages, but other information could be sent from the server too that could be useful in the fileuploaded event. So I'm suggesting that the data variable from the AJAX success function is passed to the fileuploaded event.

This really is a great widget and you are responding to issues very quickly. So thank you!

[kartik-v]

You should receive responseData on

• fileuploaded event for asynchronous upload
  and
• filebatchuploadsuccess event for synchronous upload

[zebub]

Right. Awesome!

[kartik-v]

There are some more updates to the plugin with release v4.1.3. You now get the output data from the upload events as a combined data object. This is applicable for the following events

• filepreupload
• fileuploaded
• fileuploaderror
• filebatchuploaderror
• filebatchuploadsuccess
• filebatchuploadcomplete

For example:

filebatchuploadsuccess

This event is triggered after a successful synchronous batch upload (i.e. when uploadAsync is false). Additional parameters available are:

• data: This is a data object (associative array) that sends the following information, whose keys are:
  • form: the FormData object which is passed via XHR2 (or empty object if not available).
  • files: the file stack array (or empty object if not available).
  • extra: the uploadExtraData settings for the plugin (or empty object if not available).
  • response: the data sent via ajax response (or empty object if not available).

$('#input-id').on('filebatchuploadsuccess', function(event, data) {
    var formdata = data.form, files = data.files, 
        extradata = data.extra, responsedata = data.response;
    console.log('File batch upload success');
});

[deepubrandoitte]

i adding some extra text field when uploading a image like http://doitte.com/test/bootstrap-fileinput-master/examples/index.php how can get the value of all field when we click upload button....please reply fast.

[maulanayusuf]

On uploadUrl i want to print a string like.

1. 001-success
2. 002-Success

i want to display that message when uploaded finished, i dont understand about event "fileUploaded" to get the message response.

Help me please, thank.

[matosjoao]

How can i access the data.response outside this function?

$('#input-id').on('filebatchuploadsuccess', function(event, data) {
var formdata = data.form, files = data.files,
extradata = data.extra, responsedata = data.response;
console.log('File batch upload success');
/Here i can access the data/
});
/Here i can't access the data/ why?

pls Help, thanks

[anandphulwani]

@matosjoao please read about use method and & operator which passes variable by reference.

$testvar = "";
$('#input-id').on('filebatchuploadsuccess', function(event, data) use (&$testvar) {
       $testvar = "hello";
}
echo $testvar //will print hello