Retrieve Image from Database using DataGridView Click Event

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

by

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:

Retrieve Image from Database using DataGridView Click Event

Sample Database Columns

Retrieve Image from Database using DataGridView Click Event

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:

Leave a Comment