Ajax AsyncFileUpload Control
Ajax revolutionizes the concept of web pages by introducing a novel approach known as Partial-page rendering, enabling the seamless updating of specific sections of a webpage without requiring a full page reload. Within the Ajax Control Toolkit lies a comprehensive collection of controls that empower developers to construct exceptionally responsive and interactive Ajax-enabled web applications.
AsyncFileUpload
Integrated in this toolkit is a noteworthy control, the AsyncFileUpload , which is an ASP.NET AJAX Control used for asynchronously uploading files to the server. When incorporated, the file upload does not lead to a postback, and the mean is of a more streamlined procedure for users. This control also allows the server and client side to verify the outcome of the upload, which means that error handling and validation is holistic.
To enhance the user experience further, it is possible to display a loading image while the file uploading process is underway, providing visual feedback to users. Additionally, developers can employ the SaveAs() method within a server UploadedComplete event handler to effortlessly store the uploaded file on the server, completing the file upload process seamlessly and efficiently.
C#
if (AsyncFileUpload1.HasFile)
{
AsyncFileUpload1.SaveAs(@"C:\upload\" + AsyncFileUpload1.FileName);
}
VB.Net
If AsyncFileUpload1.HasFile Then
AsyncFileUpload1.SaveAs("C:\upload\" + AsyncFileUpload1.FileName)
End If
The following Asp.Net Ajax program shows how to integrate an AsyncFileUpload to your web application. To use the Ajax Control Toolkit in your Visual Studio project, you should add reference to the AjaxControlToolkit.dll in your project.
Default.aspx
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
<script type="text/javascript">
function clientMessage() {
document.getElementById("Label1").innerHTML = "File Uploaded Completed ";
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="sm1" runat="server" />
<cc1:AsyncFileUpload ID="AsyncFileUpload1" runat="server"
UploadingBackColor="#82CAFA"
CompleteBackColor = "#FFFFFF"
OnUploadedComplete="doUpload"
OnClientUploadComplete="clientMessage"
ThrobberID="Throbber" />
<asp:Image ID="Throbber" runat="server"
ImageUrl = "https://net-informations.com/asp/ajax/img/throbber.gif" />
<asp:Label ID="Label1" runat="server" Text=""></asp:Label>
<br />
</div>
</form>
</body>
</html>
Full Source | C#
using System;
using System.Web.UI;
public partial class _Default : System.Web.UI.Page
{
protected void doUpload(object sender, AjaxControlToolkit.AsyncFileUploadEventArgs e)
{
System.Threading.Thread.Sleep(4000);
if (AsyncFileUpload1.HasFile)
{
AsyncFileUpload1.SaveAs(@"C:\upload\" + AsyncFileUpload1.FileName);
}
}
}
Full Source | VB.NET
Partial Class _Default
Inherits System.Web.UI.Page
Protected Sub doUpload(ByVal sender As Object, ByVal e As AjaxControlToolkit.AsyncFileUploadEventArgs)
System.Threading.Thread.Sleep(4000)
If AsyncFileUpload1.HasFile Then
AsyncFileUpload1.SaveAs("C:\upload\" + AsyncFileUpload1.FileName)
End If
End Sub
End Class