Question

Possible Duplicate:
Upload files using input type=“file” field with .change() event not always firing in IE and Chrome

I have the following code that successfully uploads a image using .submit()

// Photo Upload Form - AutoUpload
$('input#file').change(function() {
    var maxsize = '20971520';
    var fileExtension = $(this)
                            .val()
                            .split('.')
                            .pop()
                            .toLowerCase();

    if(this.files[0].size > maxsize) {
        $('h4#maxFileSizeExceeded').show();

    }else if($.inArray(fileExtension, ['gif','png','jpg','jpeg']) == -1) {
        $('h4#fileTypeNotAllowed').show();

    }else{
        if(pushState == '0') {
            $('div#uploadPercentage').hide();
            $('img#uploadGifLoaderHTML4').fadeIn('fast');
        }
        $('form#joinPhotoUploadForm').submit();
        jcrop_api.destroy();

        $('div#croppingBackgroundContainer').fadeIn(1000);
        $('div#cropBoxWrapper').css('margin-left', '0px');
    }
});

The issue I have is if the user requests the same file again there is no change and the submit doesn’t fire.

Is there a way for the same file to be requested again or to know its the same file again or some sort of reset that can be done on the input type=”file”?

********************* Update

      <form action="scripts/php/photo_processing.php?page=join&section=precrop" id="joinPhotoUploadForm" enctype="multipart/form-data">
        <input type="file" name="file" id="file"><br>
      </form>

user clicks a browse button and can select an image. If the user selects a different image the image will upload. However if the user selects the same image the .change() function doesn’t fire at all. I assume because its retaining the same state as before.

thx

Answer 1

If the same file is selected into the input[type=file] there is no call for the change event since there is no change. Add a button to fire your code again or use the submit event on the form.