SCRIPT5 Access denied on form submit in IE if file is triggered

SCRIPT5 Access denied on form submit in IE if file is triggered

by Pritom K Mondal

HTML

<div class="file_upload_section">
    <span>Click to upload</span>
    <input type="file" name="upload_file" />
</div>

CSS

div.file_upload_section {
    position: relative;
    background-color: yellow;
    padding: 20px;
    font-weight: bold;
    overflow: hidden;
}

div.file_upload_section input[type=file] {
    position: absolute;
    right: 0px;
    top: 0px;
    font-size: 2000px;
    height: 100%;
    opacity: 0;
    z-index: 1000;
    width: 100%;
}

JavaScript

/**
 * The way IE doesn't like.
 *
<input type="file" name="upload_file" style='display: none;' />
<input type="button" class="button" />

$('.button').click(function() {
    $('input[type=file]').trigger("click");
});

 */

$("div.file_upload_section").click(function() {
    var file = $(this).find("input[name='upload_file']");
    file.change(function() {
        var fileName = "Uploading: " + $(this).val().split("\\").pop();
        file.closest("div.file_upload_section").find("span").html(fileName);
    });
});