How to clear <INPUT TYPE="FILE">

**Jus55** · 08-03-2007, 02:35 PM

Hi,

Is there a way to clear the value of for <INPUT TYPE="FILE" id="File2"> using javascript?

When user click on button, I need to clear the value of File2

<input type="button" name="c" value="Test" onclick="clearFile()">

function clearFile() {

document.a.File2.value = "";
}

is not working?

Thanks in advance!

**jscheuer1** · 08-03-2007, 03:19 PM

You are not allowed to do that because, if you were, you could also change the filename and path of the file that the user is sending from his or her computer. That would enable you to spy on the user. I understand that you only want to reset the field. One solution that I have seen put forth is to have the file input element as the only element in a separate form. That way you can supposedly clear it by resetting that form.

**Jus55** · 08-03-2007, 03:50 PM

Thanks John!

Is it possible to reset the form in a a javascript function & then still submit the form?

e.g.
document.a.reset();
document.a.submit();

I just tried that; It's not working for me.Thats what I need to do.

I want to make sure when user click on a button to submit the form, the file field must be blank

**jscheuer1** · 08-03-2007, 04:02 PM

Why? If you reset 'a' and then submit 'a', 'a' will have no values to be submitted.

**Jus55** · 08-03-2007, 04:44 PM

my mistake; it worked.

Thanks again.

**sumitjaitly** · 12-04-2008, 10:59 AM

HTML Code:

<script language="javascript">

function fnReset()
{
alert("ehere");
window.form1.reset();

}

</script>
</head>

<body>
<form title="form1" id="form1">
<input  type="file" name="fileob">
<input  type="reset" name="reset" onCLick="fnReset()">

</form>

Im sure this works on FF and IE

Cheers
Sumit

**sumitjaitly** · 12-04-2008, 11:00 AM

This code will work. Safari has issue with this code.

**agresso** · 04-23-2009, 04:26 PM

Solution with one line javascript function here:
http://gusiev.com/?p=11

**jscheuer1** · 04-24-2009, 06:25 AM

Originally Posted by agresso

Solution with one line javascript function here:
http://gusiev.com/?p=11

That's a rather innovative approach, but has some potential problems. For the time being though, I suppose it is acceptable. I would avoid the:

Code:

href="javascript:whatever()"

construct unless your onclick event returns false, as this can cause problems in IE. Using innerHTML is non-standard, but effective here. It may not be future compatible. Unfortunately the only standards compliant method would be to replace the file input with a similar DOM element. Unfortunate in that it would require duplicating any unique characteristics of the file input without cloning (which will also clone any value it has) directly - a more individualized approach than the simplicity of innerHTML (which loses the value, a bug that becomes a feature here).

Thread: How to clear <INPUT TYPE="FILE">

Thread Tools

Search Thread

How to clear <INPUT TYPE="FILE">

Try this

Bookmarks

Bookmarks

Posting Permissions