Reader Level:
Articles

Insert Image With Details in Database With ASP.NET

By Satyapriya Nayak on May 18, 2012
From this article we will know how to insert an image with details of the employee in the database with ASP.NET.
  • 2
  • 0
  • 23931
Download Files:
 

Introduction

From this article we will know how to insert an image 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 the Default.aspx page the control moves to employee.aspx where we can see all the records of the employee with images in a Gridview.

1.jpg

Default.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Byte_array_gridview._Default" %> 
<!
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 id="Head1" runat="server">
    <title>Untitled Page</title>

</
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.Collections;
using
System.Configuration;
using
System.Data;
using
System.Linq;
using
System.Web;
using
System.Web.Security;
using
System.Web.UI;
using
System.Web.UI.HtmlControls;
using
System.Web.UI.WebControls;
using
System.Web.UI.WebControls.WebParts;
using
System.Xml.Linq;
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" %>
<!
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 id="Head1" runat="server">
    <title>Untitled Page</title
>
</
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.Collections;
using
System.Configuration;
using
System.Data;
using
System.Linq;
using
System.Web;
using
System.Web.Security;
using
System.Web.UI;
using
System.Web.UI.HtmlControls;
using
System.Web.UI.WebControls;
using
System.Web.UI.WebControls.WebParts;
using
System.Xml.Linq;
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" %>
<!
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 id="Head1" runat="server">
    <title>Untitled Page</title>
</head>
<body>
    <form id="form1" runat="server">
    <div> 
    </div>
    </form>
</body>
</html>

image.aspx.cs

using System;
using
System.Collections;
using System.Configuration;
using
System.Data;
using
System.Linq;
using
System.Web;
using
System.Web.Security;
using
System.Web.UI;
using
System.Web.UI.HtmlControls;
using
System.Web.UI.WebControls;
using
System.Web.UI.WebControls.WebParts;
using
System.Xml.Linq;
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();
        }
    }
}

Output

 2.jpg

3.jpg

4.jpg

5.jpg

6.jpg

Satyapriya Nayak

Satyapriya Nayak is a software developer from Bhubaneswar, India. He holds a Bachelor's degree in Electronics and telecommunication and is an active member of C# Corner. 

COMMENT USING

Trending up