You did totally wrong.
1) In Database you also need to save the file path location where you are saving images
2) In code you need to set ImageUrl property by setting the value from the file path which you stored in database.
For that you need to read the file from the path and then convert it to the ByteArray and then you can convert the byte array object to ToBase64String and then you can set the image url using this return value.
Please check the below sample code for your reference and implement it as per your code logic.
HTML
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>GridView Images Example</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:FileUpload ID="FileUpload1" runat="server" />
<asp:Button ID="btnUpload" runat="server" Text="Upload" OnClick="btnUpload_Click" />
</div>
<hr />
<div>
<br />
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" Font-Names="Arial">
<Columns>
<asp:BoundField DataField="ID" HeaderText="ID" />
<asp:BoundField DataField="FileName" HeaderText="Image Name" />
<asp:TemplateField HeaderText="Image">
<ItemTemplate>
<asp:Image ID="Image1" ImageUrl='<%#PreviewImage(Eval("FilePath").ToString())%>'
runat="server" Height="50px" Width="50px" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
</form>
</body>
</html>
C#
protected void Page_Load(object sender, EventArgs e)
{
if (!this.IsPostBack)
{
BindGrid();
}
}
private void BindGrid()
{
DataTable dt = new DataTable();
String strConnString = System.Configuration.ConfigurationManager.ConnectionStrings["conString"].ConnectionString;
string strQuery = "SELECT * FROM TBLFILES ORDER BY ID";
SqlCommand cmd = new SqlCommand(strQuery);
SqlConnection con = new SqlConnection(strConnString);
SqlDataAdapter sda = new SqlDataAdapter();
cmd.CommandType = CommandType.Text;
cmd.Connection = con;
try
{
con.Open();
sda.SelectCommand = cmd;
sda.Fill(dt);
GridView1.DataSource = dt;
GridView1.DataBind();
}
catch (Exception ex)
{
Response.Write(ex.Message);
}
finally
{
con.Close();
sda.Dispose();
con.Dispose();
}
}
protected string PreviewImage(string filepath)
{
string imageUrl = "";
if (File.Exists(filepath))
{
FileStream fs = new FileStream(filepath, FileMode.Open, FileAccess.Read);
BinaryReader br = new BinaryReader(fs);
Byte[] bytes = br.ReadBytes((Int32)fs.Length);
br.Close();
fs.Close();
string base64String = Convert.ToBase64String(bytes, 0, bytes.Length);
imageUrl = "data:image/png;base64," + base64String;
}
return imageUrl;
}
protected void btnUpload_Click(object sender, EventArgs e)
{
if (FileUpload1.PostedFile != null)
{
string FileName = Path.GetFileName(FileUpload1.PostedFile.FileName);
//Save files to disk
string folderPath = @"C:\Images\"; // Your path Where you want to save other than Server.MapPath
//Check whether Directory (Folder) exists.
if (!Directory.Exists(folderPath))
{
//If Directory (Folder) does not exists. Create it.
Directory.CreateDirectory(folderPath);
}
string filepath = folderPath + FileName;
//Save the File to the Directory (Folder).
FileUpload1.SaveAs(filepath);
//Add Entry to DataBase
String strConnString = System.Configuration.ConfigurationManager.ConnectionStrings["conString"].ConnectionString;
SqlConnection con = new SqlConnection(strConnString);
string strQuery = "INSERT INTO TBLFILES (FILENAME, FILEPATH) VALUES(@FileName, @FilePath)";
SqlCommand cmd = new SqlCommand(strQuery);
cmd.Parameters.AddWithValue("@FileName", FileName);
cmd.Parameters.AddWithValue("@FilePath", folderPath + FileName);
cmd.CommandType = CommandType.Text;
cmd.Connection = con;
try
{
con.Open();
cmd.ExecuteNonQuery();
}
catch (Exception ex)
{
Response.Write(ex.Message);
}
finally
{
con.Close();
con.Dispose();
}
}
BindGrid();
}
VB.Net
Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs) Handles Me.Load
If Not Me.IsPostBack Then
BindGrid()
End If
End Sub
Private Sub BindGrid()
Dim dt As DataTable = New DataTable()
Dim strConnString As String = System.Configuration.ConfigurationManager.ConnectionStrings("conString").ConnectionString
Dim strQuery As String = "SELECT * FROM TBLFILES ORDER BY ID"
Dim cmd As SqlCommand = New SqlCommand(strQuery)
Dim con As SqlConnection = New SqlConnection(strConnString)
Dim sda As SqlDataAdapter = New SqlDataAdapter()
cmd.CommandType = CommandType.Text
cmd.Connection = con
Try
con.Open()
sda.SelectCommand = cmd
sda.Fill(dt)
GridView1.DataSource = dt
GridView1.DataBind()
Catch ex As Exception
Response.Write(ex.Message)
Finally
con.Close()
sda.Dispose()
con.Dispose()
End Try
End Sub
Protected Function PreviewImage(ByVal filepath As String) As String
Dim imageUrl As String = ""
If File.Exists(filepath) Then
Dim fs As FileStream = New FileStream(filepath, FileMode.Open, FileAccess.Read)
Dim br As BinaryReader = New BinaryReader(fs)
Dim bytes As Byte() = br.ReadBytes(CType(fs.Length, Int32))
br.Close()
fs.Close()
Dim base64String As String = Convert.ToBase64String(bytes, 0, bytes.Length)
imageUrl = "data:image/png;base64," & base64String
End If
Return imageUrl
End Function
Protected Sub btnUpload_Click(ByVal sender As Object, ByVal e As EventArgs)
If FileUpload1.PostedFile IsNot Nothing Then
Dim FileName As String = Path.GetFileName(FileUpload1.PostedFile.FileName)
'Save files to disk
Dim folderPath As String = "C:\Images\" 'Your path Where you want to save other than Server.MapPath
'Check whether Directory (Folder) exists.
If Not Directory.Exists(folderPath) Then
'If Directory (Folder) does not exists. Create it.
Directory.CreateDirectory(folderPath)
End If
Dim filepath As String = folderPath & FileName
'Save the File to the Directory (Folder).
FileUpload1.SaveAs(filepath)
'Add Entry to DataBase
Dim strConnString As String = System.Configuration.ConfigurationManager.ConnectionStrings("conString").ConnectionString
Dim con As SqlConnection = New SqlConnection(strConnString)
Dim strQuery As String = "insert into tblFiles (FileName, FilePath) values(@FileName, @FilePath)"
Dim cmd As SqlCommand = New SqlCommand(strQuery)
cmd.Parameters.AddWithValue("@FileName", FileName)
cmd.Parameters.AddWithValue("@FilePath", folderPath & FileName)
cmd.CommandType = CommandType.Text
cmd.Connection = con
Try
con.Open()
cmd.ExecuteNonQuery()
Catch ex As Exception
Response.Write(ex.Message)
Finally
con.Close()
con.Dispose()
End Try
End If
End Sub
Screenshot