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
One noteworthy control in the toolkit is the AsyncFileUpload, an ASP.NET AJAX Control that facilitates the asynchronous uploading of files to a server. By leveraging this control, file uploads can occur without triggering a postback, resulting in a smoother and more user-friendly experience. Moreover, the control offers the ability to verify file uploading results on both the server and client sides, ensuring comprehensive error handling and validation.
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