VB.NET DataGridView ボタンイベント

2020年3月23日 15分22秒

hironimo

1 DataGridView 明細にボタン作成
2 DataGridView　ボタン押下イベント
3 サンプルソース
4 まとめ

今回は、DataGridViewの明細の中に、ボタンを作成し、イベントを発生させる方法を紹介します。

それでは早速見ていきましょう。

DataGridView 明細にボタン作成

まずは、DataGridViewの中にボタンを配置する方法を見ていきましょう。

dgvDetail.AllowUserToAddRows = False

Dim colBtn As New DataGridViewButtonColumn()
colBtn.Name = "button1"
colBtn.HeaderText = "明細ボタン１"
colBtn.Width = 80

Dim colId As New DataGridViewTextBoxColumn()
colId.Name = "id"
colId.HeaderText = "ID"
colId.Width = 100

Dim colName As New DataGridViewTextBoxColumn()
colName.Name = "name"
colName.HeaderText = "名前"
colName.Width = 100

Dim colBtn2 As New DataGridViewButtonColumn()
colBtn2.Name = "button2"
colBtn2.HeaderText = "明細ボタン２"
colBtn2.Width = 80

dgvDetail.Columns.Add(colBtn)
dgvDetail.Columns.Add(colId)
dgvDetail.Columns.Add(colName)
dgvDetail.Columns.Add(colBtn2)

dgvDetail.Rows.Add()
dgvDetail.Rows(0).Cells("button1").Value = "詳細"
dgvDetail.Rows(0).Cells("id").Value = "0001"
dgvDetail.Rows(0).Cells("name").Value = "すずき"
dgvDetail.Rows(0).Cells("button2").Value = "詳細2"

dgvDetail.Rows.Add()
dgvDetail.Rows(1).Cells("button1").Value = "詳細"
dgvDetail.Rows(1).Cells("id").Value = "0002"
dgvDetail.Rows(1).Cells("name").Value = "さとう"
dgvDetail.Rows(1).Cells("button2").Value = "詳細2"

dgvDetail.Rows.Add()
dgvDetail.Rows(2).Cells("button1").Value = "詳細"
dgvDetail.Rows(2).Cells("id").Value = "0003"
dgvDetail.Rows(2).Cells("name").Value = "たなか"
dgvDetail.Rows(2).Cells("button2").Value = "詳細2"

解説
3行目～6行目：明細にボタンを配置するための情報を設定
3行目：ボタン型のセル設定
4行目：名称の設定
5行目：明細のヘッダーの表示名の設定
6行目：列の幅の設定

こんな感じの明細が作成されたと思います。

これで、明細にボタンを配置することができましたね。
続いては、ボタンの押下イベントを作成していきます。

以前にボタン以外のセル(チェックボックスやコンボボックス)の種類を紹介しているので、是非参考にしてみてください。

VB.NET　DataGridView　コンボボックス　チェックボックス

2020.3.20

VB.NETで、明細を表示したい時には、DataGridViewと呼ばれるコントロールを使用します。今回は、DataGridViewのセルの型についてまとめていきたいと思います。 DataGridViewの型 DataGridViewの列追加 DataGridViewの列を追加する方法を紹介しま...

DataGridView　ボタン押下イベント

それでは、先ほど作成した明細のボタンに「ボタンクリックイベント」を追加していきましょう。

以下の手順で作成できます。

①Formのデザイナーを開いて、作成している明細をクリックしましょう。
②稲妻マークみたいなのをクリック
③CellContentClickという項目があるので、そこに任意のイベント名を設定してください。
④ENTERを押しましょう。

するとこんなソースが作成されたと思います。ここに処理を記載していきます。

Private Sub dgvDetail_CellContentClick(sender As Object, e As DataGridViewCellEventArgs) Handles dgvDetail.CellContentClick

End Sub

CellContentClickは、セルの内容をクリックした場合に発生するイベントです。
このまま処理を記載すると、どのセルをクリックしても同じ処理になってしまします。
それで問題ない場合はいいですが、基本的には、行や列ごとに処理を分けたいと思いますので、その例を記載していきます。

今回は、明細にボタンを２つ用意しているのでそれぞれでメッセージボックスを表示させるようにします。

Private Sub dgvDetail_CellContentClick(sender As Object, e As DataGridViewCellEventArgs) Handles dgvDetail.CellContentClick

    Dim colIndex As Integer = e.ColumnIndex
    Dim rowIndex As Integer = e.RowIndex

    'ボタン以外のセルの場合処理終了
    If colIndex <> 0 And colIndex <> 3 Then
        Exit Sub
    End If

    '1つ目のボタンの場合
    If colIndex = 0 Then
        MsgBox("1つ目のボタンの処理です")
    End If

    '2つ目のボタンの場合
    If colIndex = 3 Then
        MsgBox(rowIndex.ToString & "行目：2つ目のボタンの処理です　ID:" & dgvDetail.Rows(rowIndex).Cells(1).Value & " 名前:" & dgvDetail.Rows(rowIndex).Cells(2).Value)
    End If

End Sub

解説
3行目：e.ColumnIndex：イベントが発生した列Index(何列目か)を取得
4行目：e.RowIndex：イベントが発生した行Index(何行目か)を取得
16行目：rowIndexの情報を使用することで、クリックした行の明細の内容を取得することができます。
このクリックした明細の値を利用して、画面遷移や詳細情報の表示を行うことが多いのでここはしっかりと理解しておきましょう。

実行すると、1つ目のボタンと2つ目のボタンで、それぞれ指定したメッセージが表示されたと思います。
特に2つ目のボタンイベントの書き方や、内容は理解しておきましょう。

サンプルソース

最後にソースを張り付けておきます。

Form6というフォームの名前で、dgvDetailという名前のDataGridViewを配置しています。

Public Class Form6
    Private Sub Form6_Load(sender As Object, e As EventArgs) Handles MyBase.Load

        dgvDetail.AllowUserToAddRows = False

        '詳細
        Dim colBtn As New DataGridViewButtonColumn()
        colBtn.Name = "button1"
        colBtn.HeaderText = "明細ボタン１"
        colBtn.Width = 80

        Dim colId As New DataGridViewTextBoxColumn()
        colId.Name = "id"
        colId.HeaderText = "ID"
        colId.Width = 100

        Dim colName As New DataGridViewTextBoxColumn()
        colName.Name = "name"
        colName.HeaderText = "名前"
        colName.Width = 100

        '詳細
        Dim colBtn2 As New DataGridViewButtonColumn()
        colBtn2.Name = "button2"
        colBtn2.HeaderText = "明細ボタン２"
        colBtn2.Width = 80

        dgvDetail.Columns.Add(colBtn)
        dgvDetail.Columns.Add(colId)
        dgvDetail.Columns.Add(colName)
        dgvDetail.Columns.Add(colBtn2)

        dgvDetail.Rows.Add()
        dgvDetail.Rows(0).Cells("button1").Value = "詳細"
        dgvDetail.Rows(0).Cells("id").Value = "0001"
        dgvDetail.Rows(0).Cells("name").Value = "すずき"
        dgvDetail.Rows(0).Cells("button2").Value = "詳細2"

        dgvDetail.Rows.Add()
        dgvDetail.Rows(1).Cells("button1").Value = "詳細"
        dgvDetail.Rows(1).Cells("id").Value = "0002"
        dgvDetail.Rows(1).Cells("name").Value = "さとう"
        dgvDetail.Rows(1).Cells("button2").Value = "詳細2"

        dgvDetail.Rows.Add()
        dgvDetail.Rows(2).Cells("button1").Value = "詳細"
        dgvDetail.Rows(2).Cells("id").Value = "0003"
        dgvDetail.Rows(2).Cells("name").Value = "たなか"
        dgvDetail.Rows(2).Cells("button2").Value = "詳細2"

    End Sub

    ''' <summary>
    ''' 明細ボタンイベント
    ''' </summary>
    ''' <param name="sender"></param>
    ''' <param name="e"></param>
    Private Sub dgvDetail_CellContentClick(sender As Object, e As DataGridViewCellEventArgs) Handles dgvDetail.CellContentClick

        Dim colIndex As Integer = e.ColumnIndex
        Dim rowIndex As Integer = e.RowIndex

        'ボタン以外のセルの場合処理終了
        If colIndex <> 0 And colIndex <> 3 Then
            Exit Sub
        End If

        '1つ目のボタンの場合
        If colIndex = 0 Then
            MsgBox("1つ目のボタンの処理です")
        End If

        '2つ目のボタンの場合
        If colIndex = 3 Then
            MsgBox(rowIndex.ToString & "行目：2つ目のボタンの処理です　ID:" & dgvDetail.Rows(rowIndex).Cells(1).Value & " 名前:" & dgvDetail.Rows(rowIndex).Cells(2).Value)
        End If

    End Sub

End Class