Is the FormData object available in Internet Explorer 10?

Question

I'm writing a little JavaScript application that allows me to upload images asynchronously.

This script works awesome in every browser except for, guess who, Internet Explorer...

So the first thing that I made is to create a fallback for IE9- versions with AjaxForm Plugin for jQuery, which works great!

Here's the JS script.

$("#Uploader").change(function(e){
        var form = $("#UploaderForm");
        form.trigger('submit');
        $(this).attr('disabled','disabled');
        e.preventDefault();
});
$("#UploaderForm").submit(function(e){
        e.preventDefault();
        e.stopPropagation();
        var type="POST";var loading=$("#PhotoIsLoading");
        if(windowApi === true){
            var formData = new FormData($(this)[0]);
            $.ajax({
                url: url,
                type: type,
                xhr: function() {
                    myXhr = $.ajaxSettings.xhr();
                    if(myXhr.upload){ myXhr.upload.addEventListener('progress',progressHandlingFunction, false);}
                    return myXhr;
                },
                beforeSend: function(){loading.removeClass('isHidden_important');},
                success: function(response){
                    jres = JSON.parse(response);
                    alert("Test ok, file uploaded");
                },
                error: function(response){console.warn(response);},
                data: formData, 
                cache: false,
                contentType: false,
                processData: false
            });
            e.preventDefault();
        }else{
            $(this).ajaxSubmit({
                url: url,
                dataType: 'json',
                type: type,
                beforeSubmit: function(){loading.removeClass('isHidden_important');$(this).formSerialize();},
                success:function(response){
                    jres = JSON.parse(response);
                    alert("FallbackTest Complete");
                },
                error: function(response){console.warn(response);},
            });
            e.preventDefault();
            return false;
        }
    });

WindowApi and every other variable are defined in a global script but don't worry, they work. To be precise, WindowApi is this:

var windowApi=true;
if(window.File&&window.FileReader&&window.FileList&&window.Blob){
console.log("window.api ready");windowApi=true;}
else{console.log("window.api not ready");windowApi=false;};

So, with this bunch of lines of code I handle every browser and IE9- browsers...

The problem now is with IE10 because it has got all the window.* methods and it can use the FormData object. But when I try to upload something with IE10 and FormData I receive an "Access Is Denied" error for the formData object.

The HTML that is involve in this process is:

<form name="UploaderForm" id="UploaderForm" method="post" enctype="multipart/form-data">
    <input type="file" name="Uploader" id="Uploader" accept="image/*" tabindex="1" />
</form>

So at the end my question is:

How can I avoid getting an "Access Denied" exception in IE10 when trying to access the FormData Object?

Answer 1

https://stackoverflow.com/a/13657047/641293 and https://stackoverflow.com/a/4335390/641293 might be useful. IE is quite strict about what you can do with <input type='file'> programmatically.

Based on the first one, does changing the first line to this fix things?

$("#Uploader").on('click', function(e){ /* rest of the function unchanged... */