JQuery dialog / submit() not working in IE8

Question

Works everywhere except IE8. The submit never fires. I tried taking out the dialog and just leaving the submit but still nothing happens in IE8.

Javascript:

$(function () {
    $("#fileUpload").click(function () {
        $("#fileButton").click();
    });
});

$(function () {
    $("#fileButton").change(function () {
        $("#dialogUploading").dialog({
            dialogClass: 'no-close',
            modal:true,
            async:true
        });
        $("#formSubmit").submit();
    });
});

HTML:

        using (Html.BeginForm("ReferralUpload", "ReferralNetwork", FormMethod.Post, new { enctype = "multipart/form-data", id = "formSubmit", style = "display:inline" }))
        {
            <input type="file" id="fileButton" name="fileButton" style="display:none" />
            <button type="button" id="fileUpload" style="width:250px;">Upload Referrals</button>
        }

Any ideas? Thanks!

Answer 1

can you try changing $("#fileButton").change(function () { to $("#fileButton").change(function (e) { and see if that makes a difference? I think IE needs the event passed for it to be happy.

Oh, and do the same for $("#fileUpload").click(function () { to $("#fileUpload").click(function (e) {

Answer 2

Make sure you're using the correct version of jQuery. Version 2 and above aren't compatible with IE8.

http://jquery.com/browser-support/

Answer 3

After further research, I discovered it can't be done jQuery : simulating a click on a <input type="file" /> doesn't work in Firefox? . Not without some hackery. In IE8 the file input can't be programatically clicked or it won't submit. One hack is to set the opacity to zero and have an image over the button: http://www.quirksmode.org/dom/inputfile.html