How to Retrieve Images from Database (In Layer Architecture)

Now I want to retrieve these images from the database and display in a Grid View.

These are the products I want to retrieve from the database.

Presentation Layer

Take a page SearchComputers.aspx

Under SearchComputers.aspx page:

<asp:GridView ID="GVImages" runat="server" AutoGenerateColumns="false" HeaderStyle-BackColor="red" HeaderStyle-ForeColor="white" Height="278px" Width="476px">
<Columns>
<asp:BoundField DataField="ProductId" HeaderText="ID" Visible="false" />
<asp:BoundField DataField="ProductType" HeaderText="ProductType" />
<asp:TemplateField HeaderText="Image">
<ItemTemplate>
<asp:ImageButton ID="ImageButton1" runat="server" ImageUrl='<%# "Handler.ashx?id="+ Eval("ProductId")%>' Width="200" Height="100" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
<HeaderStyle BackColor="Red" ForeColor="White"></HeaderStyle>
</asp:GridView>

Under SearchComputers.aspx page.cs :

If you want to retrieve images from a database you should use a Generic Handler Class.

That class name is Handler.ashx

Under Handler.ashx Class

<%@ WebHandler Language="C#" Class="Handler" %>
using System;
using System.Web;
using System.Data.SqlClient;
using System.Configuration;
using System.Data;
using System.IO;
public class Handler: IHttpHandler {
public void ProcessRequest(HttpContext context) {
string id = context.Request.QueryString["id"];
SqlConnection con = new SqlConnection();
con.ConnectionString = System.Configuration.ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString;
// Create SQL Command
SqlCommand cmd = new SqlCommand();
cmd.CommandText = "Select Image from Products where ProductId ='" + id + "'";
cmd.CommandType = System.Data.CommandType.Text;
cmd.Connection = con;
SqlParameter ProductId = new SqlParameter("@ProductId", System.Data.SqlDbType.Int);
ProductId.Value = context.Request.QueryString["id"];
cmd.Parameters.Add(ProductId);
con.Open();
SqlDataReader dReader = cmd.ExecuteReader();
dReader.Read();
context.Response.BinaryWrite((byte[]) dReader["Image"]);
dReader.Close();
con.Close();
}
public bool IsReusable {
get {
return false;
}
}
}

Take a Class i.e. SelectProducts.cs

Under SelectProducts.cs class

public DataSet FetchAllImagesInfo() {
return ds = SqlHelper.ExecuteDataset(clsConnection.Connection, CommandType.StoredProcedure, "sp_GetProductsWithImage");
}
// Here "sp_GetProductsWithImage" is the stored procedure Name.

public class clsConnection {
public clsConnection() {
//
// TODO: Add constructor logic here
//
}
public static string Connection = ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString;
}

Under Web.config:

<connectionStrings>
<add name="ConnectionString" connectionString="user Id=sa;Password=123;DataBase=RentalShopping;Data Source=server2" providerName="System.Data.SqlClient" />
</connectionStrings>
//Here write your database name,userid,password,datasource.

Under the DataBase:

Create one database i.e RentalShopping.Under Database create one table.I have created one table i.e Products.

This is the Stored Procedure

If you want to store images into a database, see my article Click Here

9 Comments

Join the conversation! Your thoughts help the community grow.

Subash10y ago
Can you give for windows application
Subash10y ago
Good one
Gowtham Rajamanickam10y ago
very good...
Mahesh Babu14y agoedited
Thanks to all
Anand N14y ago
thank you very much
sultan kadanyo15y ago
thanks allot man
Krishna Garad15y ago
keep it up
Sapna15y ago
Easy to understand, keep sharing your ideas!
- Mahesh Babu15y ago
  Thank u