この記事では、C#のdatagridviewにMySQLのテーブルデータとチェックボックスを表示させる方法についてご説明します。
【動画】C#のdatagridviewにMySQLのテーブルデータとチェックボックスを表示させる実際の動き
本題に入る前に、まずは次の動画をご覧ください。
MySqlConnectionインスタンスを生成し、MySQLのデータベースに接続するのに必要な接続文字列を参照してMySQLのデータベースに接続します。
MySQLのデータベースに接続したら、SQLのSELECT文を実行してテーブルデータを取得します。
取得したテーブルデータをデータテーブルに格納してDataGridViewにデータを表示します。
datagridviewにデータを表示したら、チェックボックスを表示する列を追加します。
コードの流れ
MySQLのデータベースに接続する前準備
C#からMySQLのデータベースに接続するには、「MySqlConnector」と呼ばれるMySQLコネクタが必要です。
「MySqlConnector」を使うには、「MySqlConnector」のインストールが必要なので、お使いの環境で「MySqlConnector」がインストールされていない場合は下の内容をご参照ください。
参考 「MySqlConnector」のインストールTech-vb.comフォームとMySQLのテーブルデータの例
今回は次のフォームとMySQLのテーブルデータを用意しました。
フォーム上には処理を開始する実行チェックボックスとMySQLのテーブルデータとチェックボックスを表示させるdataGridViewが設置されています。
dataGridViewには、以上のMySQLのテーブルデータを表示させます。
以上のデータとチェックボックスを表示させた結果は下のとおりです。
C#のコード(例)
App.configのコード
<?xml version="1.0" encoding="utf-8" ?>
<configuration>
<startup>
<supportedRuntime version="v4.0" sku=".NETFramework,Version=v4.7.2" />
</startup>
<appSettings>
<!-- 接続文字列 -->
<add key="DBConnString" value="server={0};port={1};database={2};user={3};password={4}" />
<!-- 接続したいMySQLのサーバの名称 -->
<add key="serverVal" value="localhost" />
<!-- ポートの値 -->
<add key="portVal" value="3306" />
<!-- 接続したいデータベース名 -->
<add key="databaseVal" value="testdb" />
<!-- MySQLのデータベースに接続するためのユーザ名 -->
<add key="userVal" value="root" />
<!-- MySQLのデータベースに接続するためのパスワード -->
<add key="passwordVal" value="testPass@123456" />
</appSettings>
</configuration>
注目すべきコード①
最初に見て頂きたいのは10行目から25行目です。
<!-- 接続文字列 -->
<add key="DBConnString" value="server={0};port={1};database={2};user={3};password={4}" />
<!-- 接続したいMySQLのサーバの名称 -->
<add key="serverVal" value="localhost" />
<!-- ポートの値 -->
<add key="portVal" value="3306" />
<!-- 接続したいデータベース名 -->
<add key="databaseVal" value="testdb" />
<!-- MySQLのデータベースに接続するためのユーザ名 -->
<add key="userVal" value="root" />
<!-- MySQLのデータベースに接続するためのパスワード -->
<add key="passwordVal" value="testPass@123456" />
コードの説明
以上のコードは、MySQLのデータベースに接続するのに必要な接続文字列を「DBConnString」というキーに設定しているコードです。
10行目のコードにある{0}、{1}、{2}、{3}、{4}それぞれに、13行目から25行目のキーの値が設定されます。
キーの値はForm側のコードで設定されます。
Form側の処理は、「注目すべきコード③」をご覧ください。
なお、{0}から{4}までの設定値は以下の通りです。
- {0}「serverVal」：localhost(接続したいMySQLのサーバの名称)
- {1}「portVal」：3306(ポートの値)
- {2}「databaseVal」：testdb(接続したいデータベース名)
- {3}「userVal」：root(MySQLのデータベースに接続するためのユーザ名)
- {4}「passwordVal」：testPass@123456(MySQLのデータベースに接続するためのパスワード)
フォームのコード
using System;
using System.Windows.Forms;
using System.Data;
using System.Configuration;
using MySqlConnector;
namespace wfcs_0033
{
public partial class Form1 : Form
{
public Form1()
{
InitializeComponent();
}
private void button1_Click(object sender, EventArgs e)
{
// DataGridViewのデータソースをnullに設定して表示されているデータをクリアする
dataGridView1.DataSource = null;
// DataGridViewの列をクリアして表示されている列を削除する
dataGridView1.Columns.Clear();
// App.configのappSettingsタグ内に記述した「DBConnString」のキーの値を取得して変数「connStrTemplate」に格納する
string connStrTemplate = ConfigurationManager.AppSettings["DBConnString"];
// App.configのappSettingsタグ内に記述した「serverVal」のキーの値を取得して変数「serverVal」に格納する
string serverVal = ConfigurationManager.AppSettings["serverVal"];
// App.configのappSettingsタグ内に記述した「portVal」のキーの値を取得して変数「portVal」に格納する
string portVal = ConfigurationManager.AppSettings["portVal"];
// App.configのappSettingsタグ内に記述した「databaseVal」のキーの値を取得して変数「databaseVal」に格納する
string databaseVal = ConfigurationManager.AppSettings["databaseVal"];
// App.configのappSettingsタグ内に記述した「userVal」のキーの値を取得して変数「userVal」に格納する
string userVal = ConfigurationManager.AppSettings["userVal"];
// App.configのappSettingsタグ内に記述した「passwordVal」のキーの値を取得して変数「passwordVal」に格納する
string passwordVal = ConfigurationManager.AppSettings["passwordVal"];
// connStrTemplateの{0}、{1}、{2}、{3}、{4}の部分を「serverVal」「portVal」「databaseVal」「userVal」「passwordVal」それぞれの値に置き換える
string connectionString = string.Format(connStrTemplate, serverVal, portVal, databaseVal, userVal, passwordVal);
// MySqlConnectionオブジェクトを作成し、接続文字列を使用してデータベースに接続します。
using (MySqlConnection connection = new MySqlConnection(connectionString))
{
// データベース接続を開く
connection.Open();
// SQLクエリを作成
string query = "select * from syain";
// MySqlDataAdapterを作成
MySqlDataAdapter adapter = new MySqlDataAdapter(query, connection);
// DataTableを作成
DataTable dt = new DataTable();
// SQLクエリの結果をDataTableに格納
adapter.Fill(dt);
// DataGridViewにDataTableをバインド
dataGridView1.DataSource = dt;
// データベース接続を閉じる
connection.Close();
}
// DataGridViewCheckBoxColumnのインスタンスを生成する
DataGridViewCheckBoxColumn column = new DataGridViewCheckBoxColumn();
// 列のヘッダの名前に「チェック」の文字列を設定する
column.Name = "チェック";
// dataGridViewにチェックボックスの列を追加する
dataGridView1.Columns.Add(column);
// チェックボックスの列の表示位置を列の1列目(インデックスが0)に設定する
dataGridView1.Columns["チェック"].DisplayIndex = 0;
}
}
}
注目すべきコード①
最初に見て頂きたいのは5行目です。
using MySqlConnector;
「MySqlConnector」はMySQLコネクタを使うのに必要な名前空間です。
MySqlConnectorは「MySQLのデータベースに接続する前準備」の説明でお話したMySqlConnectorのことです。
C#からMySQLへの接続にはこのMySqlConnectorが必要になりますが、「MySQLのデータベースに接続する前準備」の説明でお話したMySqlConnectorを事前にインストールをしておかないとエラーになります
なので、忘れずにMySqlConnectorをインストールしておきましょう。
参考 「MySqlConnector」のインストールTech-vb.com注目すべきコード②
次に見て頂きたいのは19行目から22行目です。
// DataGridViewのデータソースをnullに設定して表示されているデータをクリアする
dataGridView1.DataSource = null;
// DataGridViewの列をクリアして表示されている列を削除する
dataGridView1.Columns.Clear();
コードの説明
以上のコードは、datagridviewの表示をクリアする処理のコードです。
19行目でDataSourceにnullを設定することで表示されているデータをクリアし、22行目のClearメソッドを実行することで表示されている列を削除します。
以上の2行のコードを実行することでdatagridviewの表示がクリアされます。
注目すべきコード③
次に見て頂きたいのは25行目から40行目です。
// App.configのappSettingsタグ内に記述した「DBConnString」のキーの値を取得して変数「connStrTemplate」に格納する
string connStrTemplate = ConfigurationManager.AppSettings["DBConnString"];
// App.configのappSettingsタグ内に記述した「serverVal」のキーの値を取得して変数「serverVal」に格納する
string serverVal = ConfigurationManager.AppSettings["serverVal"];
// App.configのappSettingsタグ内に記述した「portVal」のキーの値を取得して変数「portVal」に格納する
string portVal = ConfigurationManager.AppSettings["portVal"];
// App.configのappSettingsタグ内に記述した「databaseVal」のキーの値を取得して変数「databaseVal」に格納する
string databaseVal = ConfigurationManager.AppSettings["databaseVal"];
// App.configのappSettingsタグ内に記述した「userVal」のキーの値を取得して変数「userVal」に格納する
string userVal = ConfigurationManager.AppSettings["userVal"];
// App.configのappSettingsタグ内に記述した「passwordVal」のキーの値を取得して変数「passwordVal」に格納する
string passwordVal = ConfigurationManager.AppSettings["passwordVal"];
コードの説明
以上のコードは、App.configのappSettingsタグ内に記述した各キーの値を変数に格納する処理のコードです。
25行目では、「DBConnString」のキーの値を変数connStrTemplateに格納しています。
28行目では、「serverVal」のキーの値を変数serverValに格納しています。
31行目では、「portVal」のキーの値を変数portValに格納しています。
34行目では、「databaseVal」のキーの値を変数databaseValに格納しています。
37行目では、「userVal」のキーの値を変数userValに格納しています。
40行目では、「passwordVal」のキーの値を変数passwordValに格納しています。
注目すべきコード④
次に見て頂きたいのは38行目です。
// connStrTemplateの{0}、{1}、{2}、{3}、{4}の部分を「serverVal」「portVal」「databaseVal」「userVal」「passwordVal」それぞれの値に置き換える
string connectionString = string.Format(connStrTemplate, serverVal, portVal, databaseVal, userVal, passwordVal);
コードの説明
以上のコードは、connStrTemplateの{0}、{1}、{2}、{3}、{4}の部分を「serverVal」「portVal」「databaseVal」「userVal」「passwordVal」それぞれの値に置き換える処理のコードです。
- serverVal：localhost(接続したいMySQLのサーバの名称)
- portVal：3306(ポートの値)
- databaseVal：testdb(接続したいデータベース名)
- userVal：root(MySQLのデータベースに接続するためのユーザ名)
- passwordVal：testPass@123456(MySQLのデータベースに接続するためのパスワード)
置き換える前と後の状態は以下の通りです。
変数connStrTemplateには{0}、{1}、{2}、{3}、{4}が含まれていますが、string.Formatを実行すると、{0}、{1}、{2}、{3}、{4}の部分が「serverVal」「portVal」「databaseVal」「userVal」「passwordVal」それぞれの値に置き換わります。(connectionStringに格納されます)
以上により、MySQLへの接続文字列が取得できました。
注目すべきコード⑤
次に見て頂きたいのは46行目から49行目です。
// MySqlConnectionオブジェクトを作成し、接続文字列を使用してデータベースに接続します。
using (MySqlConnection connection = new MySqlConnection(connectionString))
{
// データベース接続を開く
connection.Open();
コードの説明
以上のコードは、MySqlConnectionオブジェクトを作成し、MySQLのデータベースに接続している処理のコードです。
以上のコードが正常に実行されれば、MySQLのデータベースに接続されます。
注目すべきコード⑥
次に見て頂きたいのは52行目から64行目です。
// SQLクエリを作成
string query = "select * from syain";
// MySqlDataAdapterを作成
MySqlDataAdapter adapter = new MySqlDataAdapter(query, connection);
// DataTableを作成
DataTable dt = new DataTable();
// SQLクエリの結果をDataTableに格納
adapter.Fill(dt);
// DataGridViewにDataTableをバインド
dataGridView1.DataSource = dt;
コードの説明
以上のコードは、MySQLのテーブルデータを取得するSELECT文を用意して実行し、取得したデータをdataGridViewに格納する処理のコードです。
コードの詳細
52行目のコードは、syainテーブルの値を取得するSELECT文です。
実際に取得するデータは下のとおりです。
55行目のコードは、MySqlDataAdapterインスタンスを生成し、SELECT文を関連付けます。
MySqlDataAdapterインスタンスが生成されたことで、SELECT文を実行することができるようになります。
58行目のコードは、SELECT文を実行して取得したデータを格納するのに必要なDataTableのインスタンス「dt」を生成します。
61行目のコードでは、Fillメソッドを実行するとSELECT文が実行されて、取得したデータが「dt」に格納されます。
64行目のコードでは、取得したMySQLのテーブルデータをdataGridViewに表示させます。
注目すべきコード⑦
次に見て頂きたいのは67行目です。
// データベース接続を閉じる
connection.Close();
コードの説明
以上のコードは、データベース接続を閉じる処理のコードです。
注目すべきコード⑧
次に見て頂きたいのは71行目から80行目です。
// DataGridViewCheckBoxColumnのインスタンスを生成する
DataGridViewCheckBoxColumn column = new DataGridViewCheckBoxColumn();
// 列のヘッダの名前に「チェック」の文字列を設定する
column.Name = "チェック";
// dataGridViewにチェックボックスの列を追加する
dataGridView1.Columns.Add(column);
// チェックボックスの列の表示位置を列の1列目(インデックスが0)に設定する
dataGridView1.Columns["チェック"].DisplayIndex = 0;
コードの説明
以上のコードは、チェックボックスを表示する列を追加する処理のコードです。
コードの詳細
71行目のコードは、DataGridViewにテキストボックス型のカラムを追加するためDataGridViewTextBoxColumnのインスタンスの生成を行います。
DataGridViewTextBoxColumnのインスタンスを生成することで、特定のセルにテキストボックスを持つ列をDataGridViewに追加することができます。
74行目のコードでは列のヘッダ用文字列を取得し、77行目で列のヘッダの名前に変数colNameの値を設定します。
80行目のコードは、datagridviewにテキストボックス列を追加するコードです。
ここまで説明した71行目から77行目の設定を元に、datagridviewにテキストボックス列を追加します。
83行目のコードでは、テキストボックス列を左から何番目に表示させるかを設定します。
DisplayIndexプロパティに0を設定すると、テキストボックス列はdatagridviewの1番左の列に表示されます。
DisplayIndexプロパティに1を設定した場合は2列目に表示されます。
動作確認
「フォームとMySQLのテーブルデータの例」をご覧ください。
【注意】参照設定が必要です
一つ注意点があるのですが、先ほどのコードを動かすには参照設定が必要です。
「System.Configuration」の項目を追加しないと、「ConfigurationManager」が存在しないとのことでエラーになってしまいます。
本コードを実行する際は、「System.Configuration」の項目を追加しましょう。
最後に
この記事では、C#のdatagridviewにMySQLのテーブルデータとチェックボックスを表示させる方法についてご説明しました。
C#のdatagridviewにMySQLのテーブルデータとチェックボックスを表示させたいときは本記事を参考にしてみてくださいね。
プログラミングのスキルを習得するなら
プログラミングのスキルを習得したい、今のスキルをもっと高めたい、そう考えているなら「プログラミングスクール」がおすすめです。
プログラミングのスキルの基礎を身につけるなら「TechAcademy」で1週間の無料体験があるので、これで「プログラミングの基礎」を学ぶのにおすすめですよ。
