Passing the error message to jQuery File Upload

Question

I've integrated JQuery File Upload into a Java Spring application. The returned JSON is generated from an array of Picture, where Picture contains "name", "size", "url", "thumbnail_url", "delete_url" and "delete_type".

Sometimes I decide to not accept the upload on the server, to reject it, because of missing pre-conditions, so I would like to inform inform the user about it, by returning to the client an error message.

I know it's possible to return an error message and an error code to the File Upload plugin, but I can't find it in the documentation. I suppose that I've to add two fields similar to "error_message" and "error_code".

Where can I find this documentation or what are the field names that I should return.

@Esailija, I rephrased the second sentence to be more clear. I decide on the server to make it fail, the server knows why it failed, the client doesn't, I have to inform the user about it, how do I do it? — stivlo
– stivlo, Commented Nov 11, 2011 at 17:26
Oh, well how I have done it is to return JSON with error property set to true and error msg and such properties set. I check for the error property in a success callback and if it's true I inform of the error. Never used this plugin so maybe it doesn't apply or ? — Esailija
– Esailija, Commented Nov 11, 2011 at 17:39
@Esailija, yes that is the principle, however the response is managed by the plugin, so I have to use its conventions not mine — stivlo
– stivlo, Commented Nov 11, 2011 at 17:46
By looking at source code the plugin itself doesn't check the server response at all for fields to throw error, it just thinks everything is success if the upload completes and server responds. But it calls the "done" callback with the response when that happens, can't you use the "done" event to see if there is your error field? — Esailija
– Esailija, Commented Nov 11, 2011 at 17:52

Lazaro Fernandes Lima Suleiman · Accepted Answer · 2013-04-09 18:31:20Z

23

You can use data.jqXHR.responseText

Like this:

fail: function(e, data){
    console.log(data.jqXHR.responseText);
},

answered Apr 9, 2013 at 18:31

Lazaro Fernandes Lima Suleiman

1,95220 silver badges31 bronze badges

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

2 Comments

Vladislav Rastrusny Over a year ago

This will trigger only if HTTP server returns an error response. This doesn't include returning "error" property from upload handler script inside json.

Pete - MSFT Over a year ago

This won't be called if the server returns a 200 OK. It will be called if the server returns an error code (ie - 500). In this case, the OP is failing it at the server, returning a 200 OK, therefore it needs to be parsed in the done handler.

stivlo · Accepted Answer · 2011-11-14 12:02:06Z

15

By looking at the source code (the ultimate documentation), I found out that File Upload checks an "error" field and displays that error. I tried and it works, my error gets displayed.

The JSON response is an array of Objects, one per file uploaded. In case of error, don't fill URLs and size. The important properties are the error and name and size, that will be displayed to the user.

[ 
    {
        "error": "Image must be in JPG format",
        "url": "", 
        "thumbnail_url": "", 
        "delete_url": "", 
        "delete_type": "DELETE", 
        "name": "broken_image.jpg", 
        "size": 78191
     }
]

edited Nov 14, 2011 at 12:02

answered Nov 14, 2011 at 11:57

stivlo

85.9k35 gold badges148 silver badges201 bronze badges

2 Comments

JamieD Over a year ago

When returning an error message in the JSON the message will be overwitten if the server returns an error status code. For example if the server returns a 403 the error message will be overwritten with "Forbidden". To make sure the error message from the JSON is used be sure to return a successful status code from the server.

Allfarid Morales García Over a year ago

The problem is the plugin does not return this json but some useless chunk of data like File lastModified : 1167905588000 lastModifiedDate : Thu Jan 04 2007 04:13:08 GMT-0600 (Hora estándar del Centro) name : "000_0001.JPG" size : 971424 type : "image/jpeg" webkitRelativePath : ""

Allfarid Morales García · Accepted Answer · 2016-07-12 00:24:18Z

1

done: function (e, data){
    var files = data.jqXHR.responseJSON.files;
    console.log(files);
}),

Each "files" object can have an error var you can work with, like user stivlo said.

answered Jul 12, 2016 at 0:24

Allfarid Morales García

1,5532 gold badges17 silver badges27 bronze badges

Collectives™ on Stack Overflow

Passing the error message to jQuery File Upload

3 Answers 3

2 Comments

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related