Reader Level:
ARTICLE

Insert Image With Details in Database With ASP.NET

Posted by Satyapriya Nayak Articles | ASP.NET Programming 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
  • 23352
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

COMMENT USING

Trending up