form submit - IE access denied - same domain

Question

SCRIPT5: Access denied 
jquery.min.js, line 3 char 3769

I'm getting this error by simple form submit only in IE

 $("#icon_upl").click(function(){ //icon_upl is button which open dialog
  $("[name=icon]").click();
});


$("[name=icon]").change(function() { //icon is hidden file input
  $("[name=upload_icon]").submit();  
});

I sending that form to hidden iframe which is at the same domain.

<iframe id="upload_target" name="upload_target" src="#" style="width:0;height:0;display:none;"></iframe>
<form name="upload_icon" action="upload_icon.php" method="post" enctype="multipart/form-data" target="upload_target">

submit input doesn't help

I dont get it cuz if i try to send another form that works fine

Answer 1

i have found an other way to do this ... I have make test and i found it work after 2 or 3 click on the submit button.

i have try some solution but found this by my self. this is only for ie.

note i dont use the jquery submit method because they handle the error.

function Submit() {
    try {
        $('#FormName')[0].submit();
    } catch (e) {
        setTimeout(function () { Submit(); }, 50);
    }
}

ps. sorry for my bad english, this is not my first language.

Answer 2

If you are triggering the select files dialog via JS then you will get an access denied error when submitting the form. IE does not allow this. You will have to ask user to click on input type file directly

More details here https://github.com/valums/file-uploader/issues/118#issuecomment-1387612

You can try styling the input type file though http://www.quirksmode.org/dom/inputfile.html

Answer 3

I had similar HTML and jQuery code and encountered the same issue (i.e. 'Access is denied.' JavaScript error in Internet Explorer), which I managed to resolve by taking pointers from this (great) answer.

In your instance:

1. Change the #icon_upl <button>/<input> to a <label> and make use of the tag's accessibility features by setting the for attribute on it to point to your <input name="icon" type="file"> element.
   
   This effectively makes your click() event handler redundant. However, clicking the <label> in Firefox does not seem to trigger the file <input> dialog so you'll need to perform a browser test and still have the click() event handler if the browser is Mozilla-based.

2. In order for it to work, you'll need to make sure that your file <input> is not hidden by setting its position to be absolute and moving it off-screen.

Answer 4

You can make a direct event firing on hidden input field because you can't catch it. It is possible to bind event with it and trigger it via another.

for example:

// binding event to hidden field
$('input[name=icon]:hidden').on('click', function() {
  alert('Hidden triggered');
});

// some button/ or else
// some_target is any valid selector you can use
$('some_target').on('click', function() {
  $('input[name=icon]:hidden').click(); // triggering click on hidden field will alert 'Hidden triggered'
});

Note: But its not clear from your post that if you have already something like this or not.

Answer 5

It seems to be impossible

1. You cannot read the "value" of the element as it holds the filename.
2. You can't fire up the file selection menu via JS.
3. You can't fire submit of the file uploader control via JS.

from getting access is denied error on IE8