Please refer this code.
HTML
<div style="padding: 40px">
<asp:FileUpload ID="FileUpload1" runat="server" />
<br />
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" Font-Names="Arial">
<Columns>
<asp:BoundField DataField="ID" HeaderText="ID" />
<asp:BoundField DataField="Name" HeaderText="Image Name" />
<asp:TemplateField HeaderText="Image">
<ItemTemplate>
<asp:Image ID="Image1" runat="server" ImageUrl='<%# ToBase64(Eval("Data")) %>' Height="200"
Width="200" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
JavaScript
<link rel="Stylesheet" type="text/css" href="CSS/uploadify.css" />
<script type="text/javascript" src="scripts/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="scripts/jquery.uploadify.js"></script>
<script type="text/javascript">
$(window).load(
function () {
$("#<%=FileUpload1.ClientID %>").fileUpload({
'uploader': 'scripts/uploader.swf',
'cancelImg': 'images/cancel.png',
'buttonText': 'Browse Files',
'script': 'Upload.ashx',
'folder': 'uploads',
'fileDesc': 'Image Files',
'fileExt': '*.jpg;*.jpeg;*.gif;*.png',
'multi': true,
'auto': true,
onComplete: function (id, fileName, responseJSON) {
window.location.reload();
}
});
}
);
</script>
Namespaces
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
C#
protected void Page_Load(object sender, EventArgs e)
{
if (!this.IsPostBack)
{
this.GridView1.DataSource = GetData("SELECT Id, Name, Data FROM tblFiles");
this.GridView1.DataBind();
}
}
protected string ToBase64(object data)
{
byte[] bytes = (byte[])data;
string base64String = Convert.ToBase64String(bytes, 0, bytes.Length);
return "data:image/png;base64," + base64String;
}
private DataTable GetData(string query)
{
DataTable dt = new DataTable();
string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
using (SqlConnection con = new SqlConnection(constr))
{
using (SqlCommand cmd = new SqlCommand(query))
{
using (SqlDataAdapter sda = new SqlDataAdapter())
{
cmd.CommandType = CommandType.Text;
cmd.Connection = con;
sda.SelectCommand = cmd;
sda.Fill(dt);
}
}
return dt;
}
}
Handler
<%@ WebHandler Language="C#" Class="Upload" %>
using System;
using System.Web;
using System.IO;
using System.Data;
using System.Data.SqlClient;
public class Upload : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
context.Response.Expires = -1;
try
{
HttpPostedFile postedFile = context.Request.Files["Filedata"];
string savepath = "";
string tempPath = "";
tempPath = System.Configuration.ConfigurationManager.AppSettings["FolderPath"];
savepath = context.Server.MapPath(tempPath);
string filename = postedFile.FileName;
Stream fs = postedFile.InputStream;
BinaryReader br = new BinaryReader(fs);
Byte[] bytes = br.ReadBytes((Int32)fs.Length);
context.Response.StatusCode = 200;
string constr = System.Configuration.ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
using (SqlConnection con = new SqlConnection(constr))
{
using (SqlCommand cmd = new SqlCommand("INSERT INTO tblFiles VALUES(@Name,@ContentType,@Data)", con))
{
cmd.Parameters.AddWithValue("@Name", filename);
cmd.Parameters.AddWithValue("@ContentType", postedFile.ContentType);
cmd.Parameters.AddWithValue("@Data", bytes);
con.Open();
cmd.ExecuteNonQuery();
con.Close();
}
}
context.Response.Write(200);
}
catch (Exception ex)
{
context.Response.Write("Error: " + ex.Message);
}
}
public bool IsReusable
{
get
{
return false;
}
}
}
SQL
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
SET ANSI_PADDING ON
GO
CREATE TABLE [dbo].[tblFiles](
[Id] [int] IDENTITY(1,1) NOT NULL,
[Name] [varchar](50) NULL,
[ContentType] [varchar](100) NULL,
[Data] [varbinary](max) NULL
) ON [PRIMARY] TEXTIMAGE_ON [PRIMARY]
GO
SET ANSI_PADDING OFF
GO
Screenshot