jQuery blueimp File Upload : Uploads N - 1 files to server in IE

Question

I have modified demo little bit to use in my Rails application. The plugins works fine in Chrome and FF but have an issue in IE.

In IE(all versions) I select multiple files one by one and starts uploading. The plugin uploads all but one file. If I select single file to upload then nothing happens.

Here is content of main.js

$(function () {
    'use strict';

    // Initialize the jQuery File Upload widget:
    $('#fileupload').fileupload();

    // Enable iframe cross-domain access via redirect option:
    $('#fileupload').fileupload(
        'option',
        'redirect',
        window.location.href.replace(
            /\/[^\/]*$/,
            '/cors/result.html?%s'
        )
    );

    //Reference :
    // https://github.com/blueimp/jQuery-File-Upload/issues/1324
    // https://github.com/blueimp/jQuery-File-Upload/issues/841
    $('#fileupload').bind('fileuploadsubmit', function (e, data) {
        var inputs = data.context.find(':input');
        if (inputs.filter('[required][value=""]').first().focus().length) {
            return false;
        }
        data.formData = inputs.serializeArray();
    });

    $('#fileupload').bind('fileuploadadd', function (e, data) {
        alert('file added');
    });


    $('#fileupload').fileupload('option', {
        url: '/gallery',
        maxFileSize: 5000000,
        acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i,
        process: [
            {
                action: 'load',
                fileTypes: /^image\/(gif|jpeg|png)$/,
                maxFileSize: 20000000 // 20MB
            },
            {
                action: 'resize',
                maxWidth: 1440,
                maxHeight: 900
            },
            {
                action: 'save'
            }
        ]
    }).bind('fileuploadstop', function (e, data) {
        alert('files uploaded');
      });

});

From the demo html I removed all but + Add Files and Start Upload buttons and progress bar related code.

Would anyone please help me to rectify this issue?

score 0 · Accepted Answer · edited May 23 '17 at 11:49

Finally I found the root cause with help of @Jignesh .

In our application we have customized the behavior by providing two ways to select the files to upload: 1) + Add files button 2) Link

Observed behavior: All files uploaded by MANUALLY clicking the + Add files button works and gets uploaded successfully.

However files selected using the link doesn't. The reason being the link PROGRAMATICALLY triggers the CLICK event on + Add files button, which IE doesn't support and thus no POST requests are initiated for files selected for upload using the link.

Also Console shows error: SCRIPT5 Access Denied for above observed behavior in case of IE.

References:

jQuery blueimp File Upload : Uploads N - 1 files to server in IE

1 Answers1