Hi sir,
I am doing file upload and download function in jquery....i used AjaxFileUpload plugin but its not
working in google chrome....please give me solution....i refered below link
http://www.phpletter.com/Demo/AjaxFileUpload-Demo/
Fileupload.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="UploadDownloadFile.aspx.cs"
Inherits="UploadDownloadFile" %>
<!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" src="js/jquery.js"></script>
<script type="text/javascript" src="js/ajaxfileupload.js"></script>
<script type="text/javascript">
function ajaxFileUpload() {
$("#loading")
.ajaxStart(function () {
$(this).show();
})
.ajaxComplete(function () {
$(this).hide();
});
$.ajaxFileUpload
(
{
url: 'AjaxFileUploader.ashx',
secureuri: false,
fileElementId: 'fileToUpload',
dataType: 'json',
data: { name: 'logan', id: 'id' },
success: function (data, status) {
if (typeof (data.error) != 'undefined') {
if (data.error != '') {
alert(data.error);
} else {
document.getElementById("divmsg").innerHTML="File Uploades Successfully....";
GetTable();
}
}
},
error: function (data, status, e) {
alert("Please Select File");
}
}
)
return false;
}
</script>
<script type="text/javascript">
function GetTable()
{
document.getElementById("DisplayTable").innerHTML="";
var fuImage = "Display";
var url="Handlers/DisplayTable.ashx?eventType="+fuImage;
$.getJSON(url,function(json)
{
$.each(json,function(i,weed)
{
document.getElementById("hdnfilename").value=weed.imgFullName;
var fullname=document.getElementById("hdnfilename").value;
// $("#DisplayTable").append($("<table cellpadding='0' cellspacing='0' width='50%' style='border-right:solid 1px #bdbdbd;border-top:solid 1px #bdbdbd;border-left:solid 1px #bdbdbd;border-bottom:solid 1px #bdbdbd;'><tr><td colspan=\"2\" style=\"height:10px;\"><span class=\"cont1\">" + weed.Image_Name + "</span></td><td align=\"right\" style=\"padding-right:10px;\"> <a onclick=\"delete('" + weed.Image_Id + "');\" href=\"#\" class=\"contbluelink\">Delete</a></td></tr><tr><td style=\"height:10px;\"></td></tr><tr><td><input type=\"button\" class=\"but1\" value=\"Download\" id=\"bt" + weed.Image_Id + "\"/ onclick=\"Download('" + weed.Image_Id + "');\"></td></tr></table></div></td></tr></table>"));
$("#DisplayTable").append($("<table cellpadding='0' cellspacing='0' width='50%' style='border-right:solid 1px #bdbdbd;border-top:solid 1px #bdbdbd;border-left:solid 1px #bdbdbd;border-bottom:solid 1px #bdbdbd;'><tr><td style='width: 60%; padding-left: 20px; padding-right: 15px; border-left: solid 1px #bdbdbd;border-top: solid 1px #bdbdbd;'><span class=\"cont1\">" + weed.Image_Name + "</span></td><td style='width: 20%; padding-left: 15px; padding-right: 15px; border-left: solid 1px #bdbdbd;border-top: solid 1px #bdbdbd;'><input type=\"button\" class=\"but1\" value=\"Delete\" id=\"bt" + weed.Image_Id + "\"/ onclick=\"Delete('" + weed.Image_Id + "');\"></td><td style='width: 20%; padding-left: 15px; padding-right: 15px; border-left: solid 1px #bdbdbd;border-top: solid 1px #bdbdbd;'><input type=\"button\" class=\"but1\" value=\"Download\" id=\"bt" + weed.Image_Id + "\"/ onclick=\"Download('" + fullname+ "');\"></td></tr></table>"));
});
});
}
function Delete(imageID)
{
//alert(imageID);
document.getElementById("divmsg").innerHTML="";
document.getElementById("DisplayTable").innerHTML="";
var deleteRow="Delete";
var url="Handlers/DisplayTable.ashx?eventType="+deleteRow+"&rowId="+imageID;
$.getJSON(url,function(json)
{
$.each(json,function(i,weed)
{
document.getElementById("hdnfilename").value=weed.imgFullName;
var fullname=document.getElementById("hdnfilename").value;
$("#DisplayTable").append($("<table cellpadding='0' cellspacing='0' width='50%' style='border-right:solid 1px #bdbdbd;border-top:solid 1px #bdbdbd;border-left:solid 1px #bdbdbd;border-bottom:solid 1px #bdbdbd;'><tr><td style='width: 60%; padding-left: 20px; padding-right: 15px; border-left: solid 1px #bdbdbd;border-top: solid 1px #bdbdbd;'><span class=\"cont1\">" + weed.Image_Name + "</span></td><td style='width: 20%; padding-left: 15px; padding-right: 15px; border-left: solid 1px #bdbdbd;border-top: solid 1px #bdbdbd;'><input type=\"button\" class=\"but1\" value=\"Delete\" id=\"bt" + weed.Image_Id + "\"/ onclick=\"Delete('" + weed.Image_Id + "');\"></td><td style='width: 20%; padding-left: 15px; padding-right: 15px; border-left: solid 1px #bdbdbd;border-top: solid 1px #bdbdbd;'><input type=\"button\" class=\"but1\" value=\"Download\" id=\"bt" + weed.Image_Id + "\"/ onclick=\"Download('" + fullname+ "');\"></td></tr></table>"));
});
});
}
function Download(img_fullname)
{
if(img_fullname!="")
{
window.location = "Handlers/DownloadImage.ashx?imgfullname="+img_fullname;
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<input id="fileToUpload" type="file" name="fileToUpload" class="input">
<button id="buttonUpload" onclick="return ajaxFileUpload();">
Upload</button>
<input type="hidden" runat="server" id="hdnfilename" />
<input type="hidden" runat="server" id="hdnUploadFilePath" />
<img id="loading" alt="" src="loading.gif" style="display: none;">
<div id="divmsg" style="font-weight:bold;color:Green">
</div>
<div id="DisplayTable">
</div>
</form>
</body>
</html>
ashx files
uploading image
<%@ WebHandler Language="C#" Class="AjaxFileUploader" %>
using System;
using System.Web;
using System.Data;
using System.Collections.Generic;
using System.Linq;
using System.IO;
using System.Data.SqlClient;
public class AjaxFileUploader : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
//context.Response.ContentType = "text/plain";
//context.Response.Write("Hello World");
if (context.Request.Files.Count > 0)
{
string path = context.Server.MapPath("~/uploads");
if (!Directory.Exists(path))
Directory.CreateDirectory(path);
var file = context.Request.Files[0];
if (file.FileName != "")
{
string fileName;
if (HttpContext.Current.Request.Browser.Browser.ToUpper() == "IE")
{
string[] files = file.FileName.Split(new char[] { '\\' });
fileName = files[files.Length - 1];
}
else
{
string date = DateTime.Now.ToString("ddMMyyyyhhmmss");
fileName = date + "-" + file.FileName;
}
string strFileName = fileName;
fileName = Path.Combine(path, fileName);
file.SaveAs(fileName);
SqlConnection con = new SqlConnection(System.Configuration.ConfigurationManager.AppSettings["connectionstring"].ToString());
con.Open();
SqlCommand cmd = new SqlCommand("insert into Image_Table(Image_Name,Image_Path)values(@filename,@filepath)", con);
cmd.Parameters.AddWithValue("@filename", strFileName);
cmd.Parameters.AddWithValue("@filepath", fileName);
cmd.ExecuteNonQuery();
string msg = "{";
msg += string.Format("error:'{0}',\n", string.Empty);
msg += string.Format("msg:'{0}'\n", strFileName);
msg += "}";
context.Response.Write(msg);
}
}
}
public bool IsReusable
{
get
{
return false;
}
}
}
downloading image
<%@ WebHandler Language="C#" Class="DownloadImage" %>
using System;
using System.Web;
using System.IO;
public class DownloadImage : IHttpHandler {
public void ProcessRequest (HttpContext context) {
//context.Response.ContentType = "text/plain";
//context.Response.Write("Hello World");
string fileName = context.Request.QueryString["imgfullname"].ToString();
string filePath = context.Server.MapPath("~/uploads/");
context.Response.Clear();
context.Response.ContentType = "image/jpeg";
context.Response.AddHeader("Content-Disposition", "attachment; filename=" + fileName);
context.Response.TransmitFile(filePath + fileName);
context.Response.End();
}
public bool IsReusable {
get {
return false;
}
}
}
for display and delete the all uploaded images
<%@ WebHandler Language="C#" Class="DisplayTable" %>
using System;
using System.Web;
using System.Web.Script.Serialization;
using System.Collections.ObjectModel;
using System.Data.SqlClient;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.IO;
using System.Data;
using System.Net;
public class DisplayTableInfo
{
private string _Image_Name;
public string Image_Name
{
get
{
return _Image_Name;
}
set
{
_Image_Name = value;
}
}
private int _Image_Id;
public int Image_Id
{
get
{
return _Image_Id;
}
set
{
_Image_Id = value;
}
}
private string _imgFullName;
public string imgFullName
{
get
{
return _imgFullName;
}
set
{
_imgFullName = value;
}
}
private string _Image_Path;
public string Image_Path
{
get
{
return _Image_Path;
}
set
{
_Image_Path = value;
}
}
}
public class DisplayTable : IHttpHandler
{
SqlConnection con = new SqlConnection(System.Configuration.ConfigurationManager.AppSettings["connectionstring"].ToString());
public void ProcessRequest(HttpContext context)
{
//context.Response.ContentType = "text/plain";
//context.Response.Write("Hello World");
Collection<DisplayTableInfo> collection = new Collection<DisplayTableInfo>();
DisplayTableInfo DTO;
if (context.Request.QueryString["eventType"].ToString() == "Display")
{
con.Open();
SqlCommand cmd = new SqlCommand("select * from Image_Table", con);
DataSet ds = new DataSet();
SqlDataAdapter da = new SqlDataAdapter(cmd);
da.Fill(ds);
for (int i = 0; i < ds.Tables[0].Rows.Count; i++)
{
DTO = new DisplayTableInfo();
DTO.Image_Id = Convert.ToInt32(ds.Tables[0].Rows[i]["Image_Id"].ToString());
DTO.Image_Path = ds.Tables[0].Rows[i]["Image_Path"].ToString();
DTO.imgFullName = ds.Tables[0].Rows[i]["Image_Name"].ToString();
string[] image_name = ds.Tables[0].Rows[i]["Image_Name"].ToString().Split('-');
DTO.Image_Name = image_name[1];
collection.Add(DTO);
}
}
if (context.Request.QueryString["eventType"].ToString() == "Delete")
{
int ImgId = Convert.ToInt32(context.Request.QueryString["rowId"].ToString());
con.Open();
SqlCommand cmd = new SqlCommand("delete from Image_Table where Image_Id=@imgid", con);
cmd.Parameters.AddWithValue("@imgid", ImgId);
int i = cmd.ExecuteNonQuery();
SqlCommand cmd1 = new SqlCommand("select * from Image_Table", con);
DataSet ds = new DataSet();
SqlDataAdapter da = new SqlDataAdapter(cmd1);
da.Fill(ds);
collection.Clear();
for (int j = 0; j < ds.Tables[0].Rows.Count; j++)
{
DTO = new DisplayTableInfo();
DTO.Image_Id = Convert.ToInt32(ds.Tables[0].Rows[j]["Image_Id"].ToString());
DTO.imgFullName = ds.Tables[0].Rows[j]["Image_Name"].ToString();
string[] image_name = ds.Tables[0].Rows[j]["Image_Name"].ToString().Split('-');
DTO.Image_Name = image_name[1];
collection.Add(DTO);
}
}
JavaScriptSerializer serializer = new JavaScriptSerializer();
string jsonString = serializer.Serialize(collection);
context.Response.Write(jsonString);
}
public bool IsReusable
{
get
{
return false;
}
}
}
My coge is
