In asp.net the FileUpload Field doesnot provied a way to clear its input the conventional way other controls do.
Clearing the FileUpload Input Field
Many a times we come acrros a situation in our projects where we need to reset the input fields when the user have cancels his operation.Now in my case the problem arose when the user who had selected to cancel the file upload operation after having selected the file.
My pecuilar Case
Mine was a peculiar situation where in i had to give the user the control to upload as many as 5 different files to be uploaded according to his will or desire.He may upload any one of it any time he likes.
Now the problem arose when he cancels his upload choice ,because i had given only one button to start upload operation, no matter wheter he had uploaded all or none or any one of the five upload files.
Thus i had to clear the fileupload field for those files which were cancelled by user after selection of file.
I tried various methods without much success
document.forms.FileUploadControl.value = "none";
document.forms.FileUploadControl.value = "";
since You could not set the FileUpload Control's FileName property due to security issues.
But after a lot of workaround i found a way out :-
all you need to do is simply redraw the html block where the input tag for file upload is present.FYI :- i had put all the fileinputcontrols in individual divs like
fileupload11 was in divFileUp1,
lly fileupload11 was in divFileUp2,
So i called the ClearInputFilePath() function on clientclick event of the cancel button of each file,
sending the div id of the individual fileinput fields.
thus in the cancel button of the fileUpload control3,
we send up the div id as paratmeter in ClearInputFilePath()
in the OnClientClick() event;
In this case all data will remain the same except the selected file value.
<asp:FileUpload ID="fileUpload1" runat="server" />
<asp:Button ID="btnCancelUpload" runat="server" onclientclick="clearFileInputField(divFileUp3)" Text="Cancel Upload" />
document.getElementById(divId).innerHTML = document.getElementById(tagId).innerHTML;