Input submit only working after second click

问题:

I've created the following form that allows uploading pictures, it has a submit button that is not working fine on IE (it only submits after the second click):

    <fieldset id="form-fieldset" data-listurl="@Url.Action("Index", "Partners", new { Area = "Panel" })">
<legend></legend>


<div class="editor-label">
    @Html.LabelFor(model => model.Name)
</div>
<div class="editor-field">
    @Html.EditorFor(model => model.Name)
    @Html.ValidationMessageFor(model => model.Name)
</div>

<div class="editor-label">
    @Html.LabelFor(model => model.Logo)
</div>
<div class="editor-field">
    @if (ViewData["Logo"] != null && !String.IsNullOrWhiteSpace(ViewData["Logo"].ToString()) && File.Exists(Server.MapPath("~/Content/uploads/" + ViewData["Logo"])))
    {
        <img src="@Url.Content("~/Content/uploads/" + ViewData["Logo"])" style="max-height: 150px" />
    }
    <div id="file-upload">
        <span class="input-xlarge uneditable-input">@(ViewData["Logo"] == null || String.IsNullOrWhiteSpace(ViewData["Logo"].ToString()) ? "No files selected" : ViewData["Logo"].ToString()) </span><input type="button" class="btn btn-primary select-button" value="Selecionar" /><input type="button" class="btn remove-button" value="Remover" />
        <input type="file" name="image" id="image" style="visibility: hidden" />
    </div>@Html.HiddenFor(model => model.Logo)
</div>

<div class="form-actions">
    <input type="submit" class="btn btn-primary" value="Salvar" />
    <input type="button" class="btn" id="btnCancel" value="Cancelar" />
</div>

The form above has a button to open the file dialog, instead of displaying the normal input file control.

I use the following script to open the file dialog and set a span tag content to the filename.

    <script type="text/javascript">
    $(document).ready(function () {
        $('#btnCancel').click(function () {
            location.href = $('#form-fieldset').data('listurl');
        });


        $('#file-upload .select-button').click(function () {
            $('#file-upload input[type=file]').click();
        });

        $('#file-upload input[type=file]').change(function () {
            var entireValue = $("#file-upload input[type=file]").val();

            var fileNameOnly = entireValue.substring(entireValue.lastIndexOf('\\') + 1, entireValue.length);

            $("#file-upload span").html(fileNameOnly);
        });

        $('.remove-button').click(function () {
            $('#file-upload span').html('No files selected');
            $('#file-upload input[type=file]').val('');
        });
    });
</script>

The problem happens only on IE (I've tested only on IE10). Firefox and Chrome works perfectly.