Save image along with details in database and display with Gridview

Satyapriyanayak
Posted by Satyapriyanayak under ASP.NET category on | Points: 40 | Views : 1418
We will know how to insert image along with details of the employee in the database. Here we will create three web pages as Default.aspx , employee.aspx and image.aspx. After inserting the records in Default.aspx page the control moves to employee.aspx where we can see all the records of the employee with images in a Gridview.
Default.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Byte_array_gridview._Default" %>
<head runat="server">
</head><body>
<form id="form1" runat="server">
<div>
<h2>Employee Details </h2>
<table>
<tr>
<td>
Name</td>
<td>
<asp:TextBox id="txtname" RunAt="server"></asp:TextBox>
</td>
</tr>

<tr>
<td>
Address</td>
<td>
<asp:TextBox id="txtaddress" RunAt="server"></asp:TextBox>
</td>
</tr>
<tr>
<td>
Image File </td>
<td>
<input id="Upload" type="file" runat="server" /></td>
</tr>
</table>
<asp:Button id="btn_insert" RunAt="server"
Text="Insert" onclick="btn_insert_Click"></asp:Button>
<asp:label id="lblMessage" runat="server" />
</div>
</form>
</body>
</html>

Default.aspx.cs

using System;
using System.Data;
using System.Data.SqlClient;
namespace Byte_array_gridview
{
public partial class _Default : System.Web.UI.Page
{
string strConnString = ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString;
string str;
SqlCommand com;
protected void btn_insert_Click(object sender, EventArgs e)
{
insertdata();
}
public void insertdata()
{
SqlConnection con = new SqlConnection(strConnString);
con.Open();
str = "select count(*)from employee where name='" + txtname.Text + "'";
com = new SqlCommand(str, con);
int count = Convert.ToInt32(com.ExecuteScalar());
con.Close();
if (count > 0)
{
lblMessage.Text = "Sorry! you can't take this username";
}
else
{
lblMessage.Text = "You can take this username";
con.Open();
int len = Upload.PostedFile.ContentLength;
byte[] pic = new byte[len + 1];
Upload.PostedFile.InputStream.Read(pic, 0, len);
str = "insert into employee values (@name,@address,@photo)";
com = new SqlCommand(str, con);
com.Parameters.AddWithValue("@name", txtname.Text);
com.Parameters.AddWithValue("@address", txtaddress.Text);
com.Parameters.AddWithValue("@photo", pic);
com.ExecuteNonQuery();
con.Close();
lblMessage.Text = "Employee Details Inserted Successfully!";
Response.Redirect("employee.aspx");
con.Close();
}
}
}
}

employee.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="employee.aspx.cs" Inherits="Byte_array_gridview.employee" %>
<head runat="server"></head>
<body>
<form id="form1" runat="server">
<div>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false">
<Columns>
<asp:TemplateField>
<itemtemplate>
<b>Id :</b> <%# Eval("id") %>
<br>
<b>Name :</b> <%# Eval("name")%>
<br>
<b>Address :</b> <%# Eval("address")%>
<br>
<img alt="image" src='image.aspx?id=<%# Eval("id")%>'/>
</itemtemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
</form>
</body>
</html>

employee.aspx.cs
using System;
using System.Data;
using System.Data.SqlClient;
namespace Byte_array_gridview
{
public partial class employee : System.Web.UI.Page
{
string strConnString = ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString;
string str;
SqlCommand com;
protected void Page_Load(object sender, EventArgs e)
{
SqlConnection con = new SqlConnection(strConnString);
con.Open();
str = "select id,name,address from employee";
com = new SqlCommand(str, con);
SqlDataReader reader;
reader = com.ExecuteReader();
GridView1.DataSource = reader;
GridView1.DataBind();
con.Close();
}
}
}
image.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="image.aspx.cs" Inherits="Byte_array_gridview.image" %>
<head runat="server"></head>
<body>
<form id="form1" runat="server">
</form>
</body>
</html>

image.aspx.cs
using System;
using System.Data;
using System.Drawing;
using System.Drawing.Imaging;
using System.IO;
using System.Data.SqlClient;
namespace Byte_array_gridview
{
public partial class image : System.Web.UI.Page
{
string strConnString = ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString;
string str;
SqlCommand com;
protected void Page_Load(object sender, EventArgs e)
{
SqlConnection con = new SqlConnection(strConnString);
con.Open();
str = "select photo from employee where id = '" + Request.QueryString["id"] + "'";
com = new SqlCommand(str, con);
MemoryStream stream = new MemoryStream();
byte[] image = (byte[])com.ExecuteScalar();
stream.Write(image, 0, image.Length);
Bitmap bitmap = new Bitmap(stream);
Response.ContentType = "image/Jpeg";
bitmap.Save(Response.OutputStream, ImageFormat.Jpeg);
con.Close();
stream.Close();
}
}
}

Comments or Responses

Login to post response