Here I am explaining an issue that I just noticed on the http://forums.asp.net. There the person asked that he was not able to clear the values of the new ASP.Net AJAX Control Toolkit AsyncFileUpload control when the page is revisited, refreshed or reloaded. If you need to know more about using this control, please refer my article Using ASP.Net AJAX Control Toolkit’s AsyncFileUpload Control
After some research and looking closely how it works I found the trick to clear the contents of the AsyncFileUpload Control. Basically the control comprises of a readonly textbox. I did not find any property to clear the AsyncFileUpload control. Thus I took help of JavaScript programming.
The following JavaScript method clears the contents of the AsyncFileUpload Control
<script type = "text/javascript">
function clearContents() {
var AsyncFileUpload = $get("<%=AsyncFileUpload1.ClientID%>");
var txts = AsyncFileUpload.getElementsByTagName("input");
for (var i = 0; i < txts.length; i++) {
if (txts[i].type == "text") {
txts[i].value = "";
txts[i].style.backgroundColor = "white";
}
}
}
window.onload = clearContents;
</script>
You can call this function wherever you want, above I am calling it on window onload event so that the control gets cleared each time page is reloaded, refreshed or revisited. In case you want to clear it after the file is uploaded on the server call it up on the OnClientUploadComplete event of the AsyncFileUpload control in the following way.
<script type = "text/javascript">
function uploadComplete(sender) {
clearContents();
}
</script>
The GIF below describes how this trick clears the ASP.Net AJAX Control Toolkit AsyncFileUpload control when page is refreshed, reloaded, revisited and also once the file is uploaded
That’s it. With this the article comes to an end. Let me know whether the above trick does not work for you