Retrieve Image from Database using DataGridView Click Event in VB.Net

Retrieve Image from Database using DataGridView Click Event in VB.Net

Retrieve Image from Database using DataGridView Click Event in VB.Net.

In this tutorial, you will learn how to retrieve images from your database by just pointing your mouse at a data grid view row.

Let’s assume that you have your own database with an image and its value in it. If you want to review about storing and retrieving images please take a look at this tutorial, Add and Retrieve Images in VB.Net.

Create a new project and name your project as you like.

Next, drag a datagridview and a pictureBox. Make sure to set your pictureBox size mode property to StretchImage. Here’s mine:

Sample Database Columns

Sample DataGridView and PictureBox.

Let’s first add a line of code where we will show only the ID values in the datagridview. Add this line of code to your Form1_Load or by just simply double-clicking your Form1 designer.

Importante Note: You should import Mysql.Data.dll to your project for you to access the mySQL keywords and methods.

Imports MySql.Data.MySqlClient
Public Class Form1

Dim conn As MySqlConnection
Dim cmd As MySqlCommand
Dim da As MySqlDataAdapter
Dim dt As DataTable
Dim sql As String
Dim rowIndex As Integer
Dim row As DataGridViewRow
Dim id As String
Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
Try
conn = New MySqlConnection
conn.ConnectionString = "server=localhost; userid=root; password=; database=retrieveimage;"
conn.Open()
sql = "SELECT ID FROM image;"
cmd = New MySqlCommand(sql, conn)
da = New MySqlDataAdapter
dt = New DataTable
da.SelectCommand = cmd
da.Fill(dt)
conn.Close()
DataGridView1.DataSource = dt
Catch ex As MySqlException
MsgBox(ex.Message)
Finally
conn.Close()
da.Dispose()
End Try
End Sub
End Class

Next, we are going to add a line of code to our datagridview cellclick event:

Private Sub DataGridView1_CellClick(sender As Object, e As DataGridViewCellEventArgs) Handles DataGridView1.CellClick
If e.RowIndex >= 0 Then
rowIndex = e.RowIndex
row = DataGridView1.Rows(rowIndex)
Try
id = row.Cells(0).Value.ToString()
conn = New MySqlConnection
conn.ConnectionString = "server=localhost; userid=root; password=; database=retrieveimage;"
conn.Open()
sql = "SELECT * FROM image WHERE ID = @ID;"
cmd = New MySqlCommand
With cmd
.Connection = conn
.CommandText = sql
.Parameters.Clear()
.Parameters.AddWithValue("@ID", id.ToString)
.ExecuteNonQuery()
End With
dt = New DataTable
da = New MySqlDataAdapter
da.SelectCommand = cmd
da.Fill(dt)
If dt.Rows.Count > 0 Then
arrImage = dt.Rows(0).Item(1)
Dim mstream As New System.IO.MemoryStream(arrImage)
PictureBox1.Image = Image.FromStream(mstream)
End If
Catch ex As MySqlException
MsgBox(ex.Message)
Finally
conn.Close()
da.Dispose()
End Try
End If
End Sub

After adding this line of code to your cellclick event. Run your system and try to select a value on your datagridview row. Here’s the result:

Congratulations! You have recently learned how to Retrieve Image from Database using DataGridView Click Event.

For questions or any other concerns or thesis/capstone creation with documentation, you can contact me through the following:

E-Mail: [email protected]

Facebook: facebook.com/kirk.lavapiez

Contact No.: +639771069640

To download the sample project, click here.

Ian Hero L. Lavapiez

BSIT Graduate

System Analyst and Developer

Related topic(s) that you may like:

• How to Add and Retrieve Multiple Images in VB.Net
• Transferring Multiple Data from DataGridView to mySQL database

Technology stack and requirements

To run this VB.NET project, you need the following on your development machine:

• Visual Studio 2019 or later. The free Community Edition is enough for building, debugging, and running the project.
• .NET Framework 4.7.2 or higher. Most Windows 10 and 11 systems have it preinstalled through Windows Update.
• MySQL Server 8.0 or MSSQL Express 2019. Choose whichever your capstone panel prefers; both work with VB.NET data adapters.
• MySQL Connector/NET or SqlClient library. Add via NuGet Package Manager inside Visual Studio.
• Crystal Reports (optional). Required only if the project generates printable reports; install the runtime redistributable.

Installing the source code

The download link contains a ZIP archive with the full solution. Extract and set up in five steps:

1. Extract the archive to a folder outside Program Files (avoids permission issues).
2. Open the .sln file in Visual Studio. It loads the full solution with all forms and modules.
3. Restore NuGet packages. Right-click the solution then Restore NuGet Packages if prompted.
4. Import the database. Locate the .sql file in the archive and import via phpMyAdmin (MySQL) or SQL Server Management Studio.
5. Update the connection string in App.config or module code to match your local database name, user, and password.

How to use this project for your BSIT capstone

This VB.NET project maps cleanly to standard BSIT capstone documentation. Suggested chapter alignment:

• Chapter 1 (Introduction). Discuss the problem the system solves in real-world context. Cite Philippine business or academic use cases where a manual process could be replaced.
• Chapter 2 (Review of Related Literature). Compare this system’s features against 5-10 similar published projects. Cite journals like IJERT or IEEE Access for academic-standard sources.
• Chapter 3 (Methodology). Include Use Case Diagram, Data Flow Diagram, Entity Relationship Diagram, and Activity Diagram covering all major workflows in the system.
• Chapter 4 (Results and Discussion). Screenshot each module of the running system with a caption explaining what data it processes and which user role interacts with it.
• Chapter 5 (Conclusion and Recommendations). Identify features that could be added in a Version 2, such as web dashboard, mobile app, or REST API export.

Modules typical of Retrieve Image from Database using DataGridView Click Event

• Master data. CRUD forms for the primary entities the system manages, with search and filter.
• Transaction processing. Data entry forms for the day-to-day operations the system automates.
• Reports. Formatted printable output summarizing activity per day, per user, or per category.
• User management. Login with role-based permissions (Admin, Encoder, Viewer).
• Backup and restore. Export database to a .sql or .bak file and restore when needed.

Common enhancements for capstone review

• Modernize the UI. Add Bunifu or Guna UI controls for a more polished, modern appearance.
• Add printable receipts. Integrate a printer preview form with page-setup options.
• Multi-user concurrency. Ensure the database handles simultaneous writes without lost-update errors.
• Web version. Rewrite the front-end in ASP.NET Core or React for a modern deployment path.