Clearing File Upload

Question

I have jQuery function to validate the file extension of the uploaded file. If the the file does not belong to a desired file extensions then a validation message will be shown and I will clear the value of File Upload via jQuery as

$('#ctl00_ContentPlaceHolder1_FileUpload').val("")

It is working fine in modern browsers but not in IE 8. I also tried

document.getElementById('ctl00_ContentPlaceHolder1_FileUpload').value = ''

but not working also. my full code is

if ($.inArray(ext, ['gif', 'png', 'jpg', 'jpeg', 'bmp']) == -1) {
    alert('Image must be .jpg/.jpeg/.gif/.bmp/.png only.');
    $('#ctl00_ContentPlaceHolder1_FileUpload').val("");
    document.getElementById('ctl00_ContentPlaceHolder1_FileUpload').value = '';
    $("#ctl00_ContentPlaceHolder1_FileUpload").focus();
}

Shaunak D · Accepted Answer · 2014-06-04T08:51:06.303

0

IE has some security restriction(read-only) over <input type="file">

So, a workaround would be clone() and replace the current <input>:

if(navigator.userAgent.toUpperCase().indexOf('MSIE') >= 0){
    $("input[type='file']").replaceWith($("input[type='file']").clone(true));
} else {
    $("input[type='file']").val('');
}

Also, form $('#form')[0].reset(); can be an option in case it is the only field in the form.

edited Jun 04 '14 at 08:51

answered Jun 04 '14 at 08:12

Shaunak D

20,588
10
46
79

When I try to Implement the above code I am getting **"'$.browser.msie' is null or not an object"** error – Rajesh Jun 04 '14 at 08:47
what is the jquery version you are using? `$.browser.msie` is deprecated now. – Shaunak D Jun 04 '14 at 08:49
Thanks @shaunakde The `.browser` call has been removed in jquery 1.9 so I referenced [jquery-migrate-1.2.1.js](https://github.com/jquery/jquery-migrate/#readme) on this Link in my page – Rajesh Jun 04 '14 at 08:54

Clearing File Upload

1 Answers1