In
this article today I am going to explain How to display the binary formatted
image in Gridview control using asp.net (C#, VB)
Description:
In
the previous article I have explained Save image in Binary format in Sql ServerDatabase using C#, VB.net and add, edit, delete and update record in Gridviewcontrol.
In
database, I have a table Movie in which poster of movie stored in Binary
format. In this tutorial I am going to display the binary formatted in Gridview
using ImageHandler.
Implementation:
Add
two webform to project/website. One webform will be used to display the image
in Gridview and second one used as ImageHandler.
Add
the namespace to ImageHandler webform
C#:
using System.Data;
using System.Data.SqlClient;
using
System.Configuration;
VB:
Imports System.Data
Imports System.Data.SqlClient
Imports System.Configuration
Write
the code to bind the Gridview on Page load event of page.
C#:
SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["connection"].ToString());
protected void Page_Load(object sender, EventArgs e)
{
if (Request.QueryString["image"] != null)
{
SqlDataAdapter adp = new SqlDataAdapter("select * from Movie
where id=@id", con);
adp.SelectCommand.Parameters.AddWithValue("@id", Convert.ToInt32(Request.QueryString["image"]));
DataTable
dt = new DataTable();
adp.Fill(dt);
if (dt != null)
{
Byte[] bytes = (Byte[])dt.Rows[0]["Poster"];
Response.Buffer = true;
Response.Charset = "";
Response.Cache.SetCacheability(HttpCacheability.NoCache);
Response.BinaryWrite(bytes);
Response.Flush();
Response.End();
}
}
}
VB:
Private con As New SqlConnection(ConfigurationManager.ConnectionStrings("connection").ToString())
Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
If Request.QueryString("image") IsNot Nothing Then
Dim adp As New SqlDataAdapter("select * from Movie
where id=@id", con)
adp.SelectCommand.Parameters.AddWithValue("@id", Convert.ToInt32(Request.QueryString("image")))
Dim dt As New DataTable()
adp.Fill(dt)
If dt IsNot Nothing Then
Dim bytes As [Byte]() = DirectCast(dt.Rows(0)("Poster"), [Byte]())
Response.Buffer = True
Response.Charset = ""
Response.Cache.SetCacheability(HttpCacheability.NoCache)
Response.BinaryWrite(bytes)
Response.Flush()
Response.[End]()
End If
End If
End Sub
Now
drag and drop the Gridview control from toolbox to webform.
HTML Markup
of Gridview:
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns = "False" CellPadding="4" ForeColor="#333333" GridLines="None">
<AlternatingRowStyle BackColor="White" ForeColor="#284775" />
<Columns>
<asp:BoundField DataField ="Name" HeaderText ="Name" >
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:BoundField DataField ="Genre" HeaderText ="Genre" >
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:BoundField DataField="Cost" HeaderText="Budget (in Crore)" >
<ItemStyle HorizontalAlign="Center" />
</asp:BoundField>
<asp:ImageField DataImageUrlField = "ID"
DataImageUrlFormatString = "ShowImage.aspx?image={0}" ControlStyle-Width = "150" ControlStyle-Height = "150"
HeaderText = "Poster">
<ItemStyle HorizontalAlign="Center" />
</asp:ImageField>
</Columns>
<EditRowStyle BackColor="#999999" />
<FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
<RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
<SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
<SortedAscendingCellStyle BackColor="#E9E7E2" />
<SortedAscendingHeaderStyle BackColor="#506C8C" />
<SortedDescendingCellStyle BackColor="#FFFDF8" />
<SortedDescendingHeaderStyle BackColor="#6F8DAE" />
</asp:GridView>
Add
the namespace to code file:
C#:
using System.Data;
using System.Data.SqlClient;
using
System.Configuration;
VB:
Imports System.Data
Imports System.Data.SqlClient
Imports
System.Configuration
Write
the following code to bind the Gridview
C#:
SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["connection"].ToString());
protected void Page_Load(object sender, EventArgs e)
{
if(!IsPostBack)
{
bindgridview();
}
}
public void bindgridview()
{
try
{
SqlDataAdapter adp = new SqlDataAdapter("Select * from
Movie", con);
DataTable
dt = new DataTable();
adp.Fill(dt);
if (dt.Rows.Count >
0)
{
GridView1.DataSource = dt;
GridView1.DataBind();
}
}
catch(Exception ex)
{ }
}
VB:
Dim con As New SqlConnection(ConfigurationManager.ConnectionStrings("connection").ToString())
Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
If Not IsPostBack Then
bindgridview()
End If
End Sub
Public Sub bindgridview()
Try
Dim adp As New SqlDataAdapter("Select * from Movie", con)
Dim dt As New DataTable()
adp.Fill(dt)
If dt.Rows.Count >
0 Then
GridView1.DataSource = dt
GridView1.DataBind()
End If
Catch ex As Exception
End Try
End Sub
Build,
run the project and see the result.
Result:
In this article we have learn how to display Binary formatted image from Sql Server database in asp.net (C#, VB). I hope you enjoyed this article.
No comments:
Post a Comment