file upload with file type hidden, submitting form through jquery

Question

I am using iframe for file uploading and is working fine in all browsers except IE. It says access denied on form.submit line. Please check my code below.

$(function(){
        $('.uploadBanner').click(function () {
               $('.uploadFile').trigger('click');
            });
        $(".uploadFile").on('change', function(e){  
            e.preventDefault();            
            document.getElementById('bannerUploadForm').submit();
        });  

    });

where my .uploadBanner is the click event for hidden field and .uploadFile is the hidden file type

let me know on this.

Khawer Zeshan · Accepted Answer · 2013-07-24 11:04:22Z

1

IE doesn't allow manipulation of the type="file" input element from javascript due to security reasons.

You can do a work around for this issue be detecting if the browser is ie open a file upload dialog and let the user to click on it manually

if(jQuery.browser.msie) { 
    $('#hiddenUploadForm').dialog();
}
else {
    $('.uploadFile').click();
}

edited Jul 24, 2013 at 11:04

answered Jul 23, 2013 at 12:33

Khawer Zeshan

9,6568 gold badges43 silver badges63 bronze badges

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

2 Comments

sandy Over a year ago

There is no problem in getting the dialog but when i select the file it fails to submit.

Khawer Zeshan Over a year ago

Dont click the file input field programmatically, instead let the user to click on it

Ray Nicholus · Accepted Answer · 2013-07-23 12:36:33Z

0

IE explicitly prohibits you from programmatically opening up the file chooser dialog (by triggering a click event) and then programmatically uploading any of the selected files. The error will occur when you attempt to submit the form in this case. Let the user click the file input element instead and you will be fine. If you need to style the file input element, it's not hard to do this. Simply make it opaque and add make it the child of a div that contains the proper styling. Look around on SO or Google for specifics if needed.

answered Jul 23, 2013 at 12:36

Ray Nicholus

19.9k14 gold badges65 silver badges85 bronze badges

Collectives™ on Stack Overflow

file upload with file type hidden, submitting form through jquery

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related