【C#】C#のdatagridviewにSQL Serverのテーブルデータとボタンを表示させるには

この記事では、C#のdatagridviewにSQL Serverのテーブルデータとボタンを表示させる方法についてご説明します。

【動画】C#のdatagridviewにSQL Serverのテーブルデータとボタンを表示させる実際の動き

本題に入る前に、まずは次の動画をご覧ください。


SqlConnectionインスタンスを生成し、SQL Serverのデータベースに接続するのに必要な接続文字列を参照してSQL Serverのデータベースに接続します。

SQL Serverのデータベースに接続したら、SQLのSELECT文を実行してテーブルデータを取得します。

取得したテーブルデータをデータテーブルに格納してDataGridViewにデータを表示します。

datagridviewにデータを表示したら、ボタンを表示する列を追加します。

コードの流れ

STEP.1
SQL Serverのデータベースに接続するのに必要な接続文字列を用意する
SQL Serverのデータベースに接続するのに必要な接続文字列を用意します。
STEP.2
STEP.1で用意した接続文字列を元に、SqlConnectionオブジェクトを作成する
STEP.1で用意した接続文字列を元に、SqlConnectionオブジェクトを作成します。
STEP.3
SqlConnectionオブジェクトのOpenメソッドを実行してSQL Serverのデータベースに接続する
SqlConnectionオブジェクトのOpenメソッドを実行してSQL Serverのデータベースに接続します。
STEP.4
SQLのSELECT文を実行してテーブルデータを取得する
SQLのSELECT文を実行してテーブルデータを取得します。
STEP.5
STEP.4で取得したSQL Serverのテーブルデータをデータテーブル(DataTable)に格納する
STEP.4で取得したSQL Serverのテーブルデータをデータテーブル(DataTable)に格納します。
STEP.6
データテーブル(DataTable)に格納したSQL ServerのテーブルデータをDataGridViewにデータを表示する
データテーブル(DataTable)に格納したSQL ServerのテーブルデータをDataGridViewにデータを表示します。
STEP.7
ボタンを表示する列を追加する
ボタンを表示する列を追加します。

フォームとSQL Serverのテーブルデータの例

今回は次のフォームとSQL Serverのテーブルデータを用意しました。

フォーム上には処理を開始する実行ボタンとSQL Serverのテーブルデータとボタンを表示させるdataGridViewが設置されています。

dataGridViewには、以下のSQL Serverのテーブルデータを表示させます。

以上のデータとボタンを表示させた結果は下のとおりです。

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="Data Source=(LocalDB)\MSSQLLocalDB;Initial Catalog={0};Integrated Security=True" />

        <!-- SQL Serverのデータベース名 -->
        <add key="DBName" value="CS_01" />

    </appSettings>
</configuration>

注目すべきコード

見て頂きたいのは8行目と11行目です。

8行目は、SQL Serverのデータベースファイルに接続するのに必要な接続文字列を「DBConnString」というキーに設定しているコードです。

11行目は、SQL Serverのデータベースファイルのパスを「DBName」というキーに設定しているコードです。

「DBConnString」と「DBName」のキーの値をフォーム側のコードが参照して使います。

ちなみに、今回接続しようとしているデータベース「CS_01」は下の画像にあるデータベースです。

フォームのコード

using System;
using System.Windows.Forms;
using System.Configuration;
using System.Data;
using System.Data.SqlClient;

namespace wfcs_0023
{
    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タグ内に記述した「DBName」のキーの値を取得して変数「dbPathStr」に格納する
            string dbPathStr = ConfigurationManager.AppSettings["DBName"];

            // connStrTemplateの{0}の部分を、「dbPathStr」の値に置き換える
            string connectionString = string.Format(connStrTemplate, dbPathStr);

            // SqlConnectionインスタンスを生成する
            using (SqlConnection connection = new SqlConnection(connectionString))
            {
                // SQL Serverのデータベースに接続する
                connection.Open();

                // SELECT文を用意する
                string query = "SELECT * FROM tbl_test";

                // SqlCommandインスタンスを生成する
                using (SqlCommand command = new SqlCommand(query, connection))
                {
                    // SqlDataAdapterインスタンスを生成する
                    using (SqlDataAdapter adapter = new SqlDataAdapter(command))
                    {
                        // DataTableインスタンスを生成する
                        DataTable dt = new DataTable();

                        // データテーブルにデータを格納する
                        adapter.Fill(dt);

                        // DataGridViewにデータを表示する
                        this.dataGridView1.DataSource = dt;
                    }
                }

                // SQL Serverのデータベースの接続を閉じる
                connection.Close();
            }

            // DataGridViewButtonColumnのインスタンスを生成する
            DataGridViewButtonColumn column = new DataGridViewButtonColumn();

            // 列のヘッダの名前に「確認」の文字列を設定する
            column.Name = "確認";

            // ボタンに「詳細」のテキストを追加する
            column.Text = "詳細";

            // ボタンにテキストを表示させるように設定する
            column.UseColumnTextForButtonValue = true;

            // dataGridViewにボタンの列を追加する
            dataGridView1.Columns.Add(column);

            // ボタンの列の表示位置を列の1列目(インデックスが0)に設定する
            dataGridView1.Columns["確認"].DisplayIndex = 0;
        }
    }
}

注目すべきコード①

最初に見て頂きたいのは5行目です。

using System.Data.SqlClient;

コードの説明

以上のコードは、「System.Data.SqlClient」はSqlConnectionクラスを使うのに必要な名前空間です。

SqlConnectionクラスからインスタンスを生成し、SqlConnectionインスタンスのOpenメソッドを実行することでSQL Serverのデータベースに接続することができます。

注目すべきコード②

次に見て頂きたいのは19行目から22行目です。

            // DataGridViewのデータソースをnullに設定して表示されているデータをクリアする
            dataGridView1.DataSource = null;

            // DataGridViewの列をクリアして表示されている列を削除する
            dataGridView1.Columns.Clear();

コードの説明

以上のコードは、datagridviewの表示をクリアする処理のコードです。

19行目でDataSourceにnullを設定することで表示されているデータをクリアし、22行目のClearメソッドを実行することで表示されている列を削除します。

以上の2行のコードを実行することでdatagridviewの表示がクリアされます。

注目すべきコード③

次に見て頂きたいのは25行目から28行目です。

            // App.configのappSettingsタグ内に記述した「DBConnString」のキーの値を取得して変数「connStrTemplate」に格納する
            string connStrTemplate = ConfigurationManager.AppSettings["DBConnString"];

            // App.configのappSettingsタグ内に記述した「DBName」のキーの値を取得して変数「dbPathStr」に格納する
            string dbPathStr = ConfigurationManager.AppSettings["DBName"];

コードの説明

以上のコードは、App.configのappSettingsタグ内に記述した「DBConnString」「DBName」のキーの値を取得して変数に格納するコードです。

「DBConnString」のキーの値は変数「connStrTemplate」に、「DBName」のキーの値は変数「DBName」に格納します。

注目すべきコード④

次に見て頂きたいのは25行目です。

            // connStrTemplateの{0}の部分を、「dbPathStr」の値に置き換える
            string connectionString = string.Format(connStrTemplate, dbPathStr);

コードの説明

以上のコードは、connStrTemplateの{0}の部分を、「DBName」の値に置き換える処理のコードです。

connStrTemplateの{0}の部分を、「DBName」の値に置き換える、とはどういうことかというと、{0}の部分をSQL Serverのデータベース名に置き換える、ということです。

今回は接続文字列と、SQL Serverのデータベース名を分けてそれぞれ「DBConnString」と「DBName」とキーを分けてあるので、フォームのコード側で接続文字列と、SQL Serverのデータベース名を一つの文字列に組み立てています。

参考までに、string.Format実行前と実行後の状態を以下にお見せします。

以上のように、{0}の部分が「CS_01」に置き換わっています。

参考:string.Format実行前

“Data Source=(LocalDB)\\MSSQLLocalDB;Initial Catalog={0};Integrated Security=True”

参考:string.Format実行後

“Data Source=(LocalDB)\\MSSQLLocalDB;Initial Catalog=CS_01;Integrated Security=True”

注目すべきコード⑤

次に見て頂きたいのは34行目から37行目です。

            // SqlConnectionインスタンスを生成する
            using (SqlConnection connection = new SqlConnection(connectionString))
            {
                // SQL Serverのデータベースに接続する
                connection.Open();

コードの説明

以上のコードは、SqlConnectionインスタンスを作成し、SQL Serverのデータベースファイル接続している処理のコードです。

コードの詳細

34行目のコードでは、App.configから取得したSQL Serverのデータベースの接続情報(connectionString)を元にSqlConnectionインスタンスを作成しています。

37行目のコードでは、生成したSqlConnectionインスタンスのOpenメソッドを実行してSQL Serverのデータベースに接続しています。

注目すべきコード⑥

次に見て頂きたいのは40行目から60行目です。

                // SELECT文を用意する
                string query = "SELECT * FROM tbl_test";

                // SqlCommandインスタンスを生成する
                using (SqlCommand command = new SqlCommand(query, connection))
                {
                    // SqlDataAdapterインスタンスを生成する
                    using (SqlDataAdapter adapter = new SqlDataAdapter(command))
                    {
                        // DataTableインスタンスを生成する
                        DataTable dt = new DataTable();

                        // データテーブルにデータを格納する
                        adapter.Fill(dt);

                        // DataGridViewにデータを表示する
                        this.dataGridView1.DataSource = dt;
                    }
                }

                // SQL Serverのデータベースの接続を閉じる
                connection.Close();

コードの説明

以上のコードは、SQL Serverのテーブルデータを取得するSELECT文を用意して実行し、取得したSQL ServerのテーブルデータをdataGridViewに表示する処理のコードです。

続けてSQL Serverのデータベースの接続を閉じています。

コードの詳細

40行目のコードでは、SQL Serverのテーブルデータを取得するSELECT文を用意しています。

43行目のコードでは、SELECT文を実行するために、SELECT文とSqlCommandインスタンス(command)を指定してSqlCommandクラスからインスタンスを生成します。

46行目のコードでは、SqlDataAdapterインスタンスを生成し、SELECT文を関連付けます。

SqlDataAdapterインスタンスが生成されたことで、SELECT文を実行することができるようになります。

49行目のコードでは、SELECT文を実行して取得したデータを格納するのに必要なDataTableのインスタンス「dt」を生成します。

52行目のコードでは、Fillメソッドを実行するとSELECT文が実行されて、取得したデータが「dt」に格納されます。

55行目のコードでは、取得したSQL ServerのテーブルデータをdataGridViewに表示させます。

60行目のコードでは、SQL Serverのデータベースファイルの接続を閉じています。

注目すべきコード⑦

次に見て頂きたいのは64行目から79行目です。

            // DataGridViewButtonColumnのインスタンスを生成する
            DataGridViewButtonColumn column = new DataGridViewButtonColumn();

            // 列のヘッダの名前に「確認」の文字列を設定する
            column.Name = "確認";

            // ボタンに「詳細」のテキストを追加する
            column.Text = "詳細";

            // ボタンにテキストを表示させるように設定する
            column.UseColumnTextForButtonValue = true;

            // dataGridViewにボタンの列を追加する
            dataGridView1.Columns.Add(column);

            // ボタンの列の表示位置を列の1列目(インデックスが0)に設定する
            dataGridView1.Columns["確認"].DisplayIndex = 0;

コードの説明

以上のコードは、ボタンを表示する列を追加する処理のコードです。

コードの詳細

64行目のコードは、DataGridViewにボタン型のカラムを追加するためDataGridViewButtonColumnのインスタンスの生成を行います。

DataGridViewButtonColumnのインスタンスを生成することで、特定のセルにボタンを持つ列をDataGridViewに追加することができます。

67行目のコードは、列のヘッダの名前に「確認」の文字列を設定します。

70行目のコードは、ボタンに「詳細」のテキストを追加します。

73行目のコードは、70行目のコードで設定したボタンに設定したテキストを表示させる設定です。

UseColumnTextForButtonValueプロパティにFalseを設定する、またはこのコードを実行しない場合は、下の画像のとおりボタンにテキストが表示されません。

UseColumnTextForButtonValueプロパティにTrueを設定するのを忘れないようにしましょう。

76行目のコードは、datagridviewにボタン列を追加するコードです。

ここまで説明した64行目から76行目の設定を元に、datagridviewにボタン列を追加します。

79行目のコードでは、ボタン列を左から何番目に表示させるかを設定します。

DisplayIndexプロパティに0を設定すると、ボタン列はdatagridviewの1番左の列に表示されます。

DisplayIndexプロパティに1を設定した場合は2列目に表示されます。

動作確認

「フォームとSQL Serverのテーブルデータの例」をご覧ください。

【注意】参照設定が必要です

一つ注意点があるのですが、先ほどのコードを動かすには参照設定が必要です。

「System.Configuration」の項目を追加しないと、「ConfigurationManager」が存在しないとのことでエラーになってしまいます。

本コードを実行する際は、「System.Configuration」の項目を追加しましょう。

最後に

この記事では、C#のdatagridviewにSQL Serverのテーブルデータとボタンを表示させる方法についてご説明しました。

C#のdatagridviewにSQL Serverのテーブルデータとボタンを表示させたいときは本記事を参考にしてみてくださいね。

プログラミングのスキルを習得するなら

プログラミングのスキルを習得したい、今のスキルをもっと高めたい、そう考えているなら「プログラミングスクール」がおすすめです。

プログラミングのスキルの基礎を身につけるなら「TechAcademy」で1週間の無料体験があるので、これで「プログラミングの基礎」を学ぶのにおすすめですよ。

→ TechAcademyの「1週間 無料体験」はこちら