Introduction:
Here I will explain how to clear the Ajax AsyncFileUpload control after upload files to folder or server using asp.net
Description:
In previous article I explained Ajax AsyncFileUpload example to upload files using asp.net.
Here I will explain how to clear the Ajax AsyncFileUpload control after upload files to folder or server using asp.net
Description:
In previous article I explained Ajax AsyncFileUpload example to upload files using asp.net.
During work with Ajax AsyncFileUpload control even after upload files to
folder still that is containing the path of the file which is uploaded to
folder. To clear the path of file from Ajax AsyncFileUpload we need to write some custom code for
that check the below code.
Design your aspx page
will be likes this
<%@ Register Assembly="AjaxControlToolkit"
Namespace="AjaxControlToolkit"
TagPrefix="ajax"
%>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1"
runat="server">
<title>Clear Text in Async FileUpload Control after file upload</title>
<script type="text/javascript">
// This function will execute and clear
fileupload control after file uploaded successfully
function uploadComplete() {
document.getElementById('<%=lblMsg.ClientID
%>').innerHTML = "File Uploaded
Successfully";
var uploadText = document.getElementById('<%=fileUpload1.ClientID %>').getElementsByTagName("input");
for (var i = 0; i <
uploadText.length; i++) {
if (uploadText[i].type == 'text')
{
uploadText[i].value = '';
}
}
}
// This function will execute if file upload
fails
function uploadError() {
document.getElementById('<%=lblMsg.ClientID
%>').innerHTML = "File upload
Failed.";
}
</script>
</head>
<body>
<form id="form1"
runat="server">
<ajax:ToolkitScriptManager ID="scriptManager1"
runat="server"/>
<div>
<ajax:AsyncFileUpload ID="fileUpload1"
OnClientUploadComplete="uploadComplete"
OnClientUploadError="uploadError"
CompleteBackColor="White" Width="350px" runat="server" UploaderStyle="Modern" UploadingBackColor="#CCFFFF"
ThrobberID="imgLoad" OnUploadedComplete="fileUploadComplete" /><br />
<asp:Image ID="imgLoad"
runat="server"
ImageUrl="loading.gif"
/>
<br />
<asp:Label ID="lblMsg"
runat="server"
Text=""></asp:Label>
</div>
</form>
</body>
</html>
|
If
you observe uploadComplete javascript
function in that I written functionality to show message after file upload
complete and clearing fileupload control.
Now
in code behind add following namespaces
C# Code
using System;
using System.Web.UI;
using AjaxControlToolkit;
|
After
completion of adding namespaces write following code in code behind
protected void fileUploadComplete(object sender, AsyncFileUploadEventArgs
e)
{
string filename = System.IO.Path.GetFileName(fileUpload1.FileName);
fileUpload1.SaveAs(Server.MapPath("Files/")
+ filename);
}
|
VB Code
Imports System.Web.UI
Imports AjaxControlToolkit
Partial Class Default
Inherits System.Web.UI.Page
Protected Sub fileUploadComplete(ByVal sender As Object, ByVal e As AsyncFileUploadEventArgs)
Dim filename As String =
System.IO.Path.GetFileName(fileUpload1.FileName)
fileUpload1.SaveAs(Server.MapPath("Files/")
& filename)
End Sub
End Class
|
Demo
Download
sample code attached
If you enjoyed this post, please support the blog below. It's FREE! Get the latest Asp.net, C#.net, VB.NET, jQuery, Plugins & Code Snippets for FREE by subscribing to our Facebook, Twitter, RSS feed, or by email. |
|||
|
|||
3 comments :
superb example..! i really like it.
I will follow this instruction.
how do i clear file from fileupload upload control , when i refresh page it again upload file without clicking on button to upload , any code to clear file from fileupload control
Note: Only a member of this blog may post a comment.