Inserting Images in Folder and Storing Path in Database and Showing in Grid

Raj.Trivedi
Posted by Raj.Trivedi under ASP.NET category on | Points: 40 | Views : 1536
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>
&nbsp;</td>
</tr>
<tr>
<td class="style2">
&nbsp;</td>
<td class="style3">
<asp:Button ID="btnUpload" runat="server" Text="Upload and Save"
onclick="btnUpload_Click" />
</td>
<td>
&nbsp;</td>
</tr>
<tr>
<td class="style2">
&nbsp;</td>
<td class="style3">
<asp:Literal ID="Literal1" runat="server"></asp:Literal>
</td>
<td>
&nbsp;</td>
</tr>
<tr>
<td class="style2">
&nbsp;</td>
<td class="style3">
&nbsp;</td>
<td>
&nbsp;</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;
}

}
}
}

Comments or Responses

Login to post response