Advertisement
In this Article I will explain how to
display images in gridview from database
I Created a table with Name
Display_Images as
shown below.
USE
[chinnu]
GO
/******
Object: Table [dbo].[Display_Images] Script Date: 11/07/2013
05:40:28 ******/
SET
ANSI_NULLS
ON
GO
SET
QUOTED_IDENTIFIER
ON
GO
CREATE
TABLE
[dbo].[Display_Images](
[Id]
[int] IDENTITY(1,1)
NOT
NULL,
[ImageName]
[nvarchar](max)
NOT
NULL,
[ImagePath]
[nvarchar](max)
NOT
NULL
)
ON
[PRIMARY]
GO
Now
I am creating an empty web application with name UpLoadimages,After
that I am adding a web form with name
DisplayImages.aspx.
I
am designing a UI with FileUplod Control ,Button and Grid view.
In
DisplayImages.aspx page
<%@
Page
Language="C#"
AutoEventWireup="true"
CodeBehind="DisplayImages.aspx.cs"
Inherits="UpLoadimages.DisplayImages"
%>
<!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
runat="server">
<title></title>
</head>
<body>
<form
id="form1"
runat="server">
<div>
<asp:FileUpload
ID="FileUpload1"
runat="server"
/>
<asp:Button
ID
=
"BtnUploadImages"
runat
=
"server"
Text
=
"UploadImages"
onclick="BtnUploadImages_Click"
/>
</div>
<div>
<asp:GridView
ID="gridview"
runat="server"
AutoGenerateColumns
=
"false">
<Columns>
<asp:BoundField
DataField="Id"
HeaderText="Id"/>
<asp:BoundField
DataField="ImageName"
HeaderText="ImageName"/>
<asp:ImageField
DataImageUrlField
=
"ImagePath"
ControlStyle-Height
=
"50"
ControlStyle-Width
=
"50"
HeaderText="Image
Preview"
/>
</Columns>
</asp:GridView>
</div>
</form>
</body>
</html>
In
DisplayImages.aspx.cs I am writing the logic to display images in
grid view
using
System;
using
System.Collections.Generic;
using
System.Linq;
using
System.Web;
using
System.Web.UI;
using
System.Web.UI.WebControls;
using
System.Data.SqlClient;
using
System.Data;
using
System.Configuration;
using
System.IO;
namespace
UpLoadimages
{
public
partial
class
DisplayImages
: System.Web.UI.Page
{
SqlConnection
con = new
SqlConnection("Data
Source=DotNetSharePoint;Database=Chinnu;User Id=sa;Password=Password123;");
protected
void
Page_Load(object
sender, EventArgs
e)
{
if
(!IsPostBack)
{
BindGridData();
}
}
private
void
BindGridData()
{
try
{
SqlCommand
command = new
SqlCommand("SELECT
* from Display_Images",
con);
SqlDataAdapter
da = new
SqlDataAdapter(command);
DataTable
dt = new
DataTable();
da.Fill(dt);
gridview.DataSource
= dt;
gridview.DataBind();
}
catch
(Exception
ex)
{
}
}
protected
void
BtnUploadImages_Click(object
sender, EventArgs
e)
{
if
(FileUpload1.PostedFile != null)
{
string
ImageName = Path.GetFileName(FileUpload1.PostedFile.FileName);
FileUpload1.SaveAs(Server.MapPath("DisplayImages/"
+ ImageName));
string
Query = "Insert
into Display_Images(ImageName,ImagePath)"
+ "values(@ImageName,@ImagePath)";
SqlCommand
cmd = new
SqlCommand(Query);
cmd.Connection
= con;
cmd.Parameters.AddWithValue("@ImageName",
ImageName);
cmd.Parameters.AddWithValue("@ImagePath",
"DisplayImages/"
+ ImageName);
cmd.CommandType
= CommandType.Text;
con.Open();
cmd.ExecuteNonQuery();
con.Close();
}
}
}
}
In
Web.config iam giving the database connection string
<connectionStrings>
<add
name="Connstring"
connectionString="Data
Source=DotNetSharePoint;Database=Chinnu;User
Id=sa;Password=Password123;"
providerName="System.Data.SqlClient"
/>
</connectionStrings>
After
completing all the steps,Press F5
we
can see the output as fallows.
When say images from database it means images stored in database not on the file system and pths to them stored in database
ReplyDelete