Hello Friends,
I need to implement file upload functionality using ajax. So after doing some RND on it then I will come with solutions.
Here I post live sample of ajax style file upload.
ASPX File:-uploadtest.aspx
1: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="uploadtest.aspx.cs" Inherits="uploadtest" %>
2:
3: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4: <html xmlns="http://www.w3.org/1999/xhtml">
5: <head runat="server">
6: <title></title>
7:
8: <script language="javascript" type="text/javascript">
9:
10: function onerror(args, context) { 11: document.getElementById("<%=message.ClientID %>").innerHTML = "Upload Failed"; 12: }
13: function results(args, context) { 14: document.getElementById("<%=message.ClientID %>").innerHTML = "File has been uploaded successfully"; 15: }
16: function Button1_onclick() { 17: arguments = document.getElementById("path").value + "/" + document.getElementById("File1").value; 18: <%= cbref %>
19: }
20: </script>
21: </head>
22: <body>
23: <form id="form1" runat="server">
24: <div>
25: <input type="text" id="path" value="" />
26: <input id="File1" type="file" />
27: <input id="Button1" type="button" value="upload" onclick="return Button1_onclick()" />
28: </div>
29: <span id="message" runat="server"></span>
30: <script language="javascript" type="text/javascript">
31: document.getElementById("<%=message.ClientID %>").innerHTML = ""; 32: </script>
33: </form>
34: </body>
35: </html>
CS File:-uploadtest.aspx.cs
1: using System;
2: using System.Collections.Generic;
3: using System.Linq;
4: using System.Web;
5: using System.Web.UI;
6: using System.Web.UI.WebControls;
7: using System.Web.UI.HtmlControls;
8: using System.Net;
9:
10: public partial class uploadtest : System.Web.UI.Page, ICallbackEventHandler
11: { 12: protected string cbref = string.Empty;
13: protected void Page_Load(object sender, EventArgs e)
14: { 15:
16: ClientScriptManager csm = Page.ClientScript;
17: cbref = csm.GetCallbackEventReference(this, "arguments", "results", null, "onerror", true);
18: }
19:
20:
21: #region ICallbackEventHandler Members
22:
23: public string GetCallbackResult()
24: { 25: return cbref;
26: }
27:
28: public void RaiseCallbackEvent(string eventArgument)
29: { 30: System.Net.WebClient wc = new System.Net.WebClient();
31: wc.UploadFile("http://localhost:2830/Amadeus/uploadfile.aspx", "POST", eventArgument); 32: }
33:
34: #endregion
35: }
Now here is an uploadfile.aspx.cs where file upload start.
1: using System;
2: using System.Collections.Generic;
3: using System.Linq;
4: using System.Web;
5: using System.Web.UI;
6: using System.Web.UI.WebControls;
7: using System.Web.UI.HtmlControls;
8:
9: public partial class uploadfile : System.Web.UI.Page
10: { 11: protected void Page_Load(object sender, EventArgs e)
12: { 13: HttpPostedFile myfile = Request.Files[0];
14: string path = Server.MapPath("~/upload"); 15: if (!System.IO.Directory.Exists(path))
16: { 17: System.IO.Directory.CreateDirectory(path);
18: }
19: string filename = myfile.FileName;
20: string fullpath = System.IO.Path.Combine(path, filename);
21: myfile.SaveAs(fullpath);
22: }
23: }
I hopes this will help you :)
Happy Programming...!
Reference : -
http://www.dotnetfunda.com/articles/article484-ajax-style-fileupload.aspxRegards,
Kinjal Shah
