Home/ Questions/Q 7065605
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-28T04:58:36+00:00

I’m using jQuery file upload plugin . I don’t use the UI part, only

  • 0

I’m using jQuery file upload plugin.

I don’t use the UI part, only basic one.

When I do the following, I’m having an issue in IE:

$('input#fileupload').fileupload({
    url: '/upload',
    done: function (e, data) {
    if(data.result != null && $.trim(data.result) != '')
        $('a#attachment').html(data.result);
    }
    //......................

on IE the data.result is an Object (IE9 at least, not sure the others…)

On Chrome/Firefox is just the response Text (simple plain text from the server).

Ideas?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I just ran into the same problem, and I think it is due to the fact that XHR file uploads are not supported in IE (even 9). Here’s what I believe is happening, and my solution:

    Since Safari 5+, Firefox 4+, and Chrome support XHR file uploads, the fileupload plugin can transfer the files truly asynchronously, allowing for a pure text response from the server. This pure text response is available via data.result in the done event handler, and can be used easily.

    In IE, however, the file transfer occurs via a full page refresh in a hidden iframe, causing data.result in the done handler to be a full document object, with the response text wrapped deep inside <html><body><iframe><pre> tags.

    Not only does this make it a pain to get to the data in IE, it makes the way you get to the data different between browsers.

    My solution:

    I set the forceIframeTransport option to true, which makes all browsers transfer files with a hidden iframe, like IE. It’s unfortunate to miss out on XHR file uploads, but this at least gives us the same kind of response in all browsers. Then, in my done handler, I extracted the result from the document object like so:

    var result = $( 'pre', data.result ).text();

    In your case, I think the code would look something like this:

    $('input#fileupload').fileupload({
    forceIframeTransport: true,
    url: '/upload',
    done: function ( e, data ) {
     var result = $( 'pre', data.result ).text();
     if( result != null && $.trim( result ) != '' )
        $( 'a#attachment' ).html( result );
    }
...

    Also important to note here is that the Content Type of the response from my server is ‘text/plain’. As you may have noticed, IE sometimes prompts the user to save or open a json response.

    Here are a couple links that proved useful when resolving the problem:
    https://github.com/blueimp/jQuery-File-Upload/wiki/Browser-support (see ‘XMLHttpRequest’ section at bottom)
    https://github.com/blueimp/jQuery-File-Upload/wiki/Options (see ‘forceIframeTransport’ about 1/3 of the way down)

    Hopefully this helps!

    • 0