In this article I will show you how you can perform ajax
file upload in your asp.net application. In this article I have used Asp.Net, AjaxFileUpload,
and C#.Net.
In my previous article I have shown you how you Ajax
Control Toolkit Accordion Example OR How to Use Ajax Accordion Control in
Asp.Net, Code
to Export GridView to PDF in Asp.Net Using C# and Vb.Net, JavaScript
Confirm Message From Code Behind in Asp.Net Using C#, Display
Alert Message on Page Load in MVC Application Using Javasscript.
So for this article first you needed to create a new asp.net
application and add AjaxFileUpload control, and script manager. After adding the
controls your page will look as shown below.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AjaxFileUpload.aspx.cs"
Inherits="ProjectDemo_Asp.et.AjaxFileUpload" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit"
TagPrefix="asp"
%>
<!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>Ajax
FileUpload Control In Asp.Net or Multiple FileUpload With Progress Example
in Asp.Net</title>
</head>
<body>
<form id="form1" runat="server">
<h3>
Ajax FileUpload
</h3>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:AjaxFileUpload ID="AjaxFileUpload11" runat="server"
MaximumNumberOfFiles="10"
OnUploadComplete="AjaxFileUploadEvent" Width="500px"
/>
</form>
</body>
</html>
|
In above code we have set some property for the AjaxFileUpload. They are as follows:
MaximumNumberOfFiles : In this we have defined the maximum
no of files to be allowed to upload at a time.
OnUploadComplete:
In this we will define the upload function as an event to upload the file in
specified folder.
Width: In this we will define the control width.
Now here is the server code which we will used for saving the uploaded file.
C#.Net
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using AjaxControlToolkit;
namespace ProjectDemo_Asp.et
{
public partial class AjaxFileUpload : System.Web.UI.Page
{
protected
void Page_Load(object
sender, EventArgs e)
{
}
protected
void AjaxFileUploadEvent(object sender, AjaxFileUploadEventArgs
e)
{
string
filename = System.IO.Path.GetFileName(e.FileName);
string
strUploadPath = "~/Folder/";
AjaxFileUpload11.SaveAs(Server.MapPath(strUploadPath) + filename);
}
}
}
|
VB.Net
Imports System
Imports System.Collections.Generic
Imports System.Linq
Imports System.Web
Imports System.Web.UI
Imports System.Web.UI.WebControls
Imports AjaxControlToolkit
Namespace ProjectDemo_Asp.et
Partial Public Class AjaxFileUpload
Inherits
System.Web.UI.Page
Protected
Sub Page_Load(ByVal
sender As Object,
ByVal e As
EventArgs)
End Sub
Protected
Sub AjaxFileUploadEvent(ByVal sender As Object, ByVal e As AjaxFileUploadEventArgs)
Dim
filename As String
= System.IO.Path.GetFileName(e.FileName)
Dim
strUploadPath As String
= "~/Folder/"
AjaxFileUpload11.SaveAs(Server.MapPath(strUploadPath) + filename)
End Sub
End Class
End Namespace
|
Now what you think you will be able to upload the file. No
you will not be able to upload the file it will cause error while uploading the
files.
So for successful upload we will add an event handler in our
web.config file
<?xml version="1.0"?>
<configuration>
<system.web>
<httpHandlers>
<add verb="*" path="AjaxFileUploadHandler.axd"
type="AjaxControlToolkit.AjaxFileUploadHandler,
AjaxControlToolkit"/>
</httpHandlers>
</system.web>
</configuration>
|
Now we will create folder in our solution.
Now we have done. View the page in browser you will
After success full upload let’s check the folder weather files
have actually uploaded or not.
About the Author
Please let me know you comment..
ReplyDeletebest way for uploading multiple files with ajax fileupload control
Deleteusing AjaxControlToolkit;
ReplyDeletemakes Error,
Where I will get the assemby sir
Hi Sagar
DeleteFirst thanks for posting your comment. for getting AjaxcontrolToolkit reference you need to download AjaxcontrolToolkit library from asp.net website. please check the link. in this download you will get AjaxcontrolToolkit .dll .
http://ajaxcontroltoolkit.codeplex.com/
Hi sagar this link may help you please check
ReplyDeletehttp://www.aspdotnet-pools.com/2014/06/how-to-use-and-install.html
The name of the event is 'OnClientUpdateComplete' and not 'OnUploadComplete' in Version 3.5 and 4.0. Control does not render when I define a function for this event, only black box ist displayed, found out the website raises javascript error about a mission function then.
ReplyDeleteAlso the control needs the TolkitScriptManager in order to run properly.
Ether there is something mystic involved or the control is broken! Cant go deeper in this, wasted my whole workday on this!!!
Hi, The above provided is working file. after your comment i am attaching the demo of the article. please check the link. If you are getting error. it may happen that your library is not proper please download it again or you are missing your web.config setting which is
Deletedemo download :
https://app.box.com/s/aa0fjddei0yilobvwcts
please check the web.config configuration mention in above article.
Deletegood article
ReplyDeletesee this is very good and easier way for multiple file uploading
ReplyDeletehttp://aspwebdeveloper.blogspot.in/2014/11/multiple-fileupload-using-aspnet.html
Hi when i try to execute the above program i am getting the following error
ReplyDeleteHTTP Error 500.23 - Internal Server Error
An ASP.NET setting has been detected that does not apply in Integrated managed pipeline mode.
I am using ajaxcontrolToolkit 4.5
Please tell me how to solve this error
Hi please check the some of the solution for the error.
Deletehttp://stackoverflow.com/questions/4209999/an-asp-net-setting-has-been-detected-that-does-not-apply-in-integrated-managed-p
http://stackoverflow.com/questions/16897262/http-error-500-23-internal-server-error
http://www.codeproject.com/Questions/585641/HTTPplusErrorplus-plus-plusInternalplusServer
http://forums.iis.net/t/1161020.aspx?HTTP+Error+500+23+How+do+i+solve+this+
hi, I am able to upload the files locally on my PC. but on the web server, I see it goes to 100%, and then errored.
ReplyDeleteHi What the error u r getting
DeleteHi, I got this error when loading the aspx page.
ReplyDeleteParser Error Message: Could not load type 'AjaxControlToolkit.AjaxFileUploadHandler' from assembly 'AjaxControlToolkit'.
Source error:
Line 13:
Line 14:
Line 15:
Hi
DeletePlease check the below mention link for solution.
http://forums.asp.net/t/1692536.aspx?Solution+of+Could+not+load+type+AjaxControlToolkit+ToolkitScriptManager+from+assembly+AjaxControlToolkit+Version+3+5+40412+0+Culture+neutral+PublicKeyToken+28f01b0e84b6d53e+
http://stackoverflow.com/questions/16814310/ajaxcontroltoolkit-error-raising-upload-complete-event-and-start-new-upload
http://stackoverflow.com/questions/23502160/asp-net-ajax-and-could-not-load-type
Hi
ReplyDeletei am not able to upload ,whenever i click on upload button nothing is happening, I have written handlers also in web .config ,but then also nothing is happening.
In IE browser i can't see drag and drop option from one server where as same configuration working fine in different server. even its not displaying drag and drop box. both servers are windows 2008.
ReplyDeleteAny section is blocking in the server.