Hello over here we have a database named uploadimages
In this code we are storing the images in Image folder and storing the path in database and binding the Image in gridview using the path in database.
// Database Creation
create database imageupload
// Table creation
CREATE TABLE [dbo].[images](
[id] [int] IDENTITY(1,1) NOT NULL,
[imagepath] [varchar](max) NULL
)
//Data for Table
INSERT [dbo].[images] ([id], [imagepath]) VALUES (15, N'~/Images/Picture1.png')
INSERT [dbo].[images] ([id], [imagepath]) VALUES (16, N'~/Images/gold-medal-icon-vector-material_34-53342_03.jpg')
INSERT [dbo].[images] ([id], [imagepath]) VALUES (17, N'~/Images/gold-medal-icon-vector-material_34-53342_04.jpg')
INSERT [dbo].[images] ([id], [imagepath]) VALUES (18, N'~/Images/gold-medal-icon-vector-material_34-53342_11.jpg')
// Inserting Images using Stored Procedure
create proc [dbo].[saveimg]
(
@imagepath varchar(max)
)
as
begin
insert into images(imagepath) values(@imagepath)
end
//Showing Images in Grid
CREATE proc [dbo].[ShowGrid]
as
begin
select * from images
end
// HTML Mark UP
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ImageUpload.aspx.cs" Inherits="Uploading_Images.ImageUpload" %>
<!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></title>
<style type="text/css">
.style1
{
width: 100%;
}
.style2
{
width: 134px;
}
.style3
{
width: 217px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<table class="style1">
<tr>
<td class="style2">
Browse PDF</td>
<td class="style3">
<asp:FileUpload ID="fupdf" runat="server" />
</td>
<td>
</td>
</tr>
<tr>
<td class="style2">
</td>
<td class="style3">
<asp:Button ID="btnUpload" runat="server" Text="Upload and Save"
onclick="btnUpload_Click" />
</td>
<td>
</td>
</tr>
<tr>
<td class="style2">
</td>
<td class="style3">
<asp:Literal ID="Literal1" runat="server"></asp:Literal>
</td>
<td>
</td>
</tr>
<tr>
<td class="style2">
</td>
<td class="style3">
</td>
<td>
</td>
</tr>
</table>
</div>
<br />
<br />
<div align="center">
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" >
<Columns>
<asp:BoundField DataField="id" HeaderText="ID" />
<asp:TemplateField HeaderText="Image">
<ItemTemplate>
<asp:Image ID="img1" ImageUrl='<%#Eval("imagepath") %>' Height="50" Width="50" runat="server" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
</form>
</body>
</html>
//Code Behind
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Configuration;
using System.IO;
using System.Data.SqlClient;
using System.Data;
namespace Uploading_Images
{
public partial class ImageUpload : System.Web.UI.Page
{
string strconn = ConfigurationManager.ConnectionStrings["cnnLocal"].ConnectionString;
string desc = "0";
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
BindGrid();
}
}
protected void btnUpload_Click(object sender, EventArgs e)
{
string extension = Path.GetExtension(fupdf.FileName);
string filename = Path.GetFileName(fupdf.FileName);
string uploadFolder = Request.PhysicalApplicationPath + "Images\\"; // This will get the actual path for upload.
string upload = "~/Images/" + filename; // This path will go in database because asp.net requires virtual path.
fupdf.SaveAs(uploadFolder + filename);
string getfile = upload;
SqlConnection con = new SqlConnection(strconn);
SqlCommand cmdins = new SqlCommand("saveimg", con);
cmdins.CommandType = CommandType.StoredProcedure;
cmdins.Parameters.AddWithValue("@imagepath", getfile);
con.Open();
cmdins.ExecuteNonQuery();
Literal1.Text = "Data Saved";
BindGrid();
}
private void BindGrid()
{
try
{
SqlConnection con = new SqlConnection(strconn);
con.Open();
SqlCommand cmdins = new SqlCommand();
cmdins.CommandType = CommandType.StoredProcedure;
SqlDataAdapter da = new SqlDataAdapter();
da.SelectCommand = new SqlCommand("ShowGrid", con);
DataSet ds = new DataSet();
da.Fill(ds, "images");
GridView1.DataSource = ds;
GridView1.DataBind();
}
catch (Exception ex)
{
desc = ex.Message;
}
}
}
}