Clear FileUpload Content in ASP.NET

Question

How to clear the textbox content in a FileUpload control in ASP.NET?

Answer 1

The ASP.NET FileUpload control maps to the HTML input element with type="file". This element is considered Read-only and you cannot change it directly.

However, there seem to be atleast three workarounds to accomplish the goal of "clearing the field" :

a. Reset the form, either using script or by providing a input type="reset" button.

b. Re-establish the input field in the DOM by setting its attributes again:

var fu = document.getElementById("fileUpload");
if (fu != null)
{
  fu.setAttribute("type", "input");
  fu.setAttribute("type", "file");
}

c. Recreate the innerHTML of the field from the existing innerHTML as demonstrated here:

var fu = document.getElementById("fileUpload");
if (fu != null)
{
  // You may be able to use the cached object in `fu`, but I'm not sure.
  document.getElementById("fileUpload").innerHTML = fu.innerHTML;
}

Answer 2

Hi nice trick but for me following worked instead of innerhtml

            var fu = document.getElementById("flUpload");
            if (fu != null) {
                document.getElementById("flUpload").outerHTML = fu.outerHTML;
            }

regards, Harish

Answer 3

I have just Used the following in the Button click event in the code behind ...

protected void btnReset_Click(object sender, EventArgs e)
{
    flUpload = new FileUpload();
}

The postback caused by the button click allows a page refresh and creates a new instance of the FileUpload control.