This is the aspx page sample design to upload the image to database
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Imagehandler.aspx.cs" Inherits="saavura.Imagehandler" %>
<!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></title>
<script language="javascript" type="text/javascript">
function validate() {
var result = false;
var upfile = document.getElementById("FileUpload1").value;
if (upfile != "") {
var accept = "png,gif,jpg,jpeg".split(',');
var getExtention = upfile.split('.');
var extention = getExtention[getExtention.length - 1];
for (i = 0; i < accept.length; i++) {
if (accept[i] == extention) {
result = true;
break;
}
}
if (!result) {
alert("allowed file extention are png,gif,jpg,jpeg");
}
}
else {
alert("select image to Upload");
}
return result;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<table>
<tr>
<td>
<asp:FileUpload ID="FileUpload1" runat="server" />
<asp:Button ID="btnUploadImage" runat="server"
onclientclick="return validate();" Text="UPLOADIMAGE TO DATABASE"
onclick="btnUploadImage_Click1" />
</td>
</tr>
</table>
</div>
<div>
<asp:GridView ID="gvImages" CssClass="Gridview" runat="server" AutoGenerateColumns="False"
HeaderStyle-BackColor="#7779AF" HeaderStyle-ForeColor="white">
<Columns>
<asp:BoundField HeaderText = "Image Name" DataField="Id" />
<asp:TemplateField HeaderText="Image">
<ItemTemplate>
<asp:Image ID="Image1" runat="server" ImageUrl='<%# "ImageHandler.ashx?ImID="+ Eval("Id") %>' Height="150px" Width="150px"/>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
</form>
</body>
</html>
The cs page of this aspx is below here..
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Data.SqlClient;
using System.Collections;
using System.IO;
using System.Configuration;
namespace imagehand_and_crystalrep
{
public partial class Imagehandler : System.Web.UI.Page
{
//string strcon = ConfigurationManager.ConnectionStrings["dbconnection"].ConnectionString;
SqlConnection con = new SqlConnection(@"Server=.\sqlexpress;Initial Catalog=myapptest;User Id=sa;Password=sa123");
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
BindGridData();
}
}
protected void btnUploadImage_Click1(object sender, EventArgs e)
{
if (FileUpload1.PostedFile.ContentType.ToLower().StartsWith("image") &&
FileUpload1.HasFile)
{
Hashtable imageHash = new Hashtable();
imageHash.Add("@imageData", FileUpload1.FileBytes);
con.Open();
SqlCommand cmd = new SqlCommand("sp_UploadImage2", con);
//cmd.Parameters.Add("@imageData", SqlDbType.Image).Value = imageHash["@imageData"];
cmd.CommandType = CommandType.StoredProcedure;
cmd.Parameters.Add(new SqlParameter("@imageData", SqlDbType.Image)).Value = imageHash["@imageData"];
cmd.ExecuteNonQuery();
con.Close();
}
Response.Redirect("imagehandler.aspx");
}
private void BindGridData()
{
SqlCommand command = new SqlCommand("SELECT Image,ID from Images", con);
SqlDataAdapter daimages = new SqlDataAdapter(command);
DataTable dt = new DataTable();
daimages.Fill(dt);
gvImages.DataSource = dt;
gvImages.DataBind();
gvImages.Attributes.Add("bordercolor", "black");
}
}
}
The Imagehandler.ashx is the page processing request page for image to process from design to cs page which is necessary...
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Data.SqlClient;
using System.Collections;
using System.IO;
using System.Configuration;
namespace imagehand_and_crystalrep
{
public partial class Imagehandler : System.Web.UI.Page
{
//string strcon = ConfigurationManager.ConnectionStrings["dbconnection"].ConnectionString;
SqlConnection con = new SqlConnection(@"Server=.\sqlexpress;Initial Catalog=myapptest;User Id=sa;Password=sa123");
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
BindGridData();
}
}
protected void btnUploadImage_Click1(object sender, EventArgs e)
{
if (FileUpload1.PostedFile.ContentType.ToLower().StartsWith("image") &&
FileUpload1.HasFile)
{
Hashtable imageHash = new Hashtable();
imageHash.Add("@imageData", FileUpload1.FileBytes);
con.Open();
SqlCommand cmd = new SqlCommand("sp_UploadImage2", con);
//cmd.Parameters.Add("@imageData", SqlDbType.Image).Value = imageHash["@imageData"];
cmd.CommandType = CommandType.StoredProcedure;
cmd.Parameters.Add(new SqlParameter("@imageData", SqlDbType.Image)).Value = imageHash["@imageData"];
cmd.ExecuteNonQuery();
con.Close();
}
Response.Redirect("imagehandler.aspx");
}
private void BindGridData()
{
SqlCommand command = new SqlCommand("SELECT Image,ID from Images", con);
SqlDataAdapter daimages = new SqlDataAdapter(command);
DataTable dt = new DataTable();
daimages.Fill(dt);
gvImages.DataSource = dt;
gvImages.DataBind();
gvImages.Attributes.Add("bordercolor", "black");
}
}
}