チュートリアル : GridView Web サーバー コントロールでのストアド プロシージャによるデータの表示
更新 : 2007 年 11 月
このチュートリアルでは、GridView コントロールにストアド プロシージャを使用してデータを表示する方法を説明します。ストアド プロシージャは、ユーザーのアプリケーション コードではなく、Microsoft SQL Server データベースに格納されている SQL クエリです。ストアド プロシージャは、クエリ コードと比べると、よりセキュアで、多くの場合、より高速で実行できます。このチュートリアルでは、ストアド プロシージャの結果セットを取得する SqlDataSource コントロールを作成します。SqlDataSource コントロールは、GridView コントロールのデータ ソースとして機能します。GridView コントロールは、ストアド プロシージャによって生成された結果セットを読み取り、データの表示に必要な行とテーブルを作成します。
このチュートリアルでは、次の作業を行う方法について説明します。
Visual Web Developer で SQL Server データベースに接続します。
SqlDataSource コントロールを使用して、データ アクセスとバインディングの管理を行います。
GridView コントロールに表示するデータを返すストアド プロシージャを追加します。
GridView コントロールで、ストアド プロシージャが返したデータを表示します。
必要条件
このチュートリアルを実行するための要件は次のとおりです。
Visual Studio 2008 または Visual Web Developer 2008 Express Edition。
.gif "メモ")
メモ :このチュートリアルで使用する [新しいストアド プロシージャの追加] 機能は Visual Web Developer 2005 Express Edition ではサポートされていません。
SQL Server Express Edition。SQL Server がインストールされている場合、代わりに使用することもできますが、いくつかの手順を微調整する必要があります。
MDAC (Microsoft Data Access Components) Version 2.7 以降。
Microsoft Windows XP または Windows Server 2003 を使用している場合は、MDAC 2.7 が既にインストールされています。ただし、Microsoft Windows 2000 を使用している場合は、コンピュータに既にインストールされている MDAC のアップグレードが必要になる場合があります。詳細については、MSDN Web サイトの「Microsoft Data Access Components (MDAC) Installation」を参照してください。
SQL Server Northwind データベースへのアクセス。SQL Server の Northwind サンプル データベースをダウンロードし、インストールする方法については、Microsoft SQL Server の Web サイトの「サンプル データベースのインストール」を参照してください。
メモ :SQL Server にログオンする方法については、サーバー管理者にお問い合わせください。
Web サイトの作成
次の手順に従って、新しい Web サイトおよびページを作成します。
ファイル システム Web サイトを作成するには
Visual Web Developer を開きます。
[ファイル] メニューの [新規作成] をポイントし、[Web サイト] をクリックします。Visual Web Developer Express Edition を使用している場合は、[ファイル] メニューの [新しい Web サイト] をクリックします。
[新しい Web サイト] ダイアログ ボックスが表示されます。
[Visual Studio にインストールされたテンプレート] の [ASP.NET Web サイト] をクリックします。
最初の [場所] ボックスで、[ファイル システム] をクリックし、次に、Web サイトのページを格納するフォルダの名前を入力します。
たとえば、フォルダ名を「C:\WebSites\StoredProcedure」と入力します。
[言語] ボックスの一覧で、作業に使用するプログラミング言語をクリックします。
[OK] をクリックします。
Visual Web Developer Express Edition によりフォルダが作成され、Default.aspx という名前の新しいページが作成されます。
データを返すストアド プロシージャの追加
ASP.NET Web ページにデータを表示するには、次の操作が必要です。
データベースなどのデータ ソースに対する接続。
次の手順では、SQL Server の Northwind データベースへの接続を作成します。
表示用にデータを返すストアド プロシージャ。
ページ上のデータ ソース コントロール。ストアド プロシージャを実行して、結果セットを管理します。
ページ上の、データを表示するためのコントロール。
次の手順では、GridView コントロールにデータを表示します。GridView コントロールが SqlDataSource コントロールからデータを取得します。
最初にストアド プロシージャを作成します。
データを返すストアド プロシージャを作成するには
サーバー エクスプローラの [データ接続] を右クリックし、[接続の追加] をクリックします。Visual Web Developer Express Edition を使用している場合は、データベース エクスプローラを使用します。
[接続の追加] ダイアログ ボックスが表示されます。
[データ ソース] ボックスの一覧に [Microsoft SQL Server (SqlClient)] が表示されない場合は、[変更] をクリックして、[データ ソースの変更] ダイアログ ボックスの [Microsoft SQL Server] を選択します。
[接続のプロパティ] ダイアログ ボックスではなく [データ ソースの選択] ダイアログ ボックスが表示された場合は、[データ ソース] ボックスの一覧から使用するデータ ソースの種類を選択します。このチュートリアルでは、データ ソースの種類として [Microsoft SQL Server] を選択します。[データ プロバイダ] ボックスの一覧で、[.NET Framework SQL Server 用データ プロバイダ] をクリックし、[続行] をクリックします。
メモ :Visual Web Developer に [サーバー エクスプローラ] タブが表示されない場合は、[表示] メニューの [サーバー エクスプローラ] をクリックします。Visual Web Developer Express Edition で、[表示] メニューの [データベース エクスプローラ] をクリックします。
[接続の追加] ボックスで、[サーバー名] ボックスにサーバー名を入力します。
[サーバーにログオンする] セクションについては、実行されている SQL Server データベースにアクセスするためのオプション (統合セキュリティまたは個別の ID とパスワード) を選択し、必要に応じてユーザー名とパスワードを入力します。
パスワードを入力した場合は、[パスワードの保存] チェック ボックスをオンにします。
[データベースの選択または入力] に「Northwind」と入力します。
[接続の確認] をクリックして、接続を確認したら [OK] をクリックします。
新しい接続が作成され、サーバー エクスプローラの [データ接続] の下に表示されます。
サーバー エクスプローラで、[データ接続] の下の新しく作成した接続を展開します。Visual Web Developer Express Edition を使用している場合は、データベース エクスプローラを使用します。
[データ接続] が展開され、[テーブル]、[ビュー]、[ストアド プロシージャ] などの子接続を含めることができます。
[ストアド プロシージャ] を右クリックし、[新しいストアド プロシージャの追加] をクリックします。
メモ :[新しいストアド プロシージャの追加] 機能は Visual Web Developer 2005 Express Edition ではサポートされていません。
新しいストアド プロシージャに次のコードを追加します。既存のコードがあれば、上書きします。
CREATE PROCEDURE GetEmployees AS Select EmployeeID, LastName, FirstName from Employees RETURNウィンドウを閉じ、[はい] をクリックして、ストアド プロシージャを作成します。
メモ :プロシージャを保存すると、CREATE キーワードが ALTER に変わります。
データを表示する GridView コントロールの追加
データ ソースへの接続を確立した後で、次の要素が必要となります。
ページ上の、ストアド プロシージャを実行し、結果セットを管理するためのデータ ソース コントロール。
ページ上の、データを表示するためのコントロール。
次の手順では、GridView コントロールにデータを表示します。GridView コントロールが SqlDataSource コントロールからデータを取得します。
これらの要素は、個別に Web サイトに追加できます。ただし、最も容易な方法は、GridView コントロールにデータを表示し、ウィザードを使用して接続およびデータ ソース コントロールを作成することです。次の手順では、ページにデータを表示するために必要な要素の作成方法を説明します。
データを表示するために GridView コントロールを追加および設定するには
Default.aspx ページに切り替えるか、Default.aspx ページを開いて、デザイン ビューに切り替えます。
ツールボックスの [データ] グループから、GridView コントロールをページにドラッグします。
[GridView タスク] メニューの [データ ソースの選択] ボックスの [新しいデータ ソース] をクリックします。
[データ ソース構成ウィザード] ダイアログ ボックスが表示されます。
[データベース] をクリックし、[OK] をクリックします。
これで、データを SQL Server データベースから取得するように指定しました。
[データ ソースに ID を指定します] ボックスに、既定のデータ ソース コントロール名が表示されます (SqlDataSource1)。この名前は変更する必要はありません。
データ ソースの構成 - SqlDataSource1 ウィザードに接続を選択するためのページが表示されます。
[アプリケーションがデータベースへの接続に使用するデータ接続] ボックスに、前に作成した接続名を入力し、[次へ] をクリックします。
ウィザードに、接続文字列を構成ファイルに保存するためのページが表示されます。接続文字列を構成ファイルに格納すると、次の 2 つの利点があります。
この方がページ内に格納するよりも安全です。
同じ接続文字列を複数のページで使用できます。
[はい、この接続を次の名前で保存します] チェック ボックスをオンにして、[次へ] をクリックします。
ウィザードに、データベースから取得するデータを指定するためのページが表示されます。
[カスタム SQL ステートメントまたはストアド プロシージャを指定する] をクリックし、[次へ] をクリックします。
[カスタム ステートメントまたはストアド プロシージャを定義します。] ページで、[ストアド プロシージャ] をクリックし、既に作成したストアド プロシージャ (GetEmployees) をクリックします。
[次へ] をクリックします。
[クエリのテスト] をクリックして、希望するデータが取得できることを確認します。
[終了] をクリックします。
ストアド プロシージャからのデータを表示する DetailsView コントロールの追加
パラメータを受け取るストアド プロシージャから返されたデータを表示できます。次の手順では、GridView コントロールで選択された行の値の計算結果を表示する DetailsView コントロールを作成します。GridView 行は従業員レコードを表し、DetailsView コントロールは選択された従業員の販売総額を表示します。
以下のものが必要です。
従業員 ID をパラメータとして受け取り、値を返すストアド プロシージャ。
ストアド プロシージャを実行し、結果セットを管理する、ページ上の 2 つ目のデータ ソース コントロール。両方のデータ ソース コントロールは、同じ Northwind データベースへの接続を表します。このチュートリアルで前に作成した SQL Server Northwind データベースへの接続を再利用します。
ページ上の、データを表示するための DetailsView コントロール。
最初にストアド プロシージャを作成します。
DetailsView コントロールで表示するデータを返すストアド プロシージャを作成するには
サーバー エクスプローラで、[データ接続] の下の前に作成した接続を展開します。Visual Web Developer Express Edition を使用している場合は、この操作にデータベース エクスプローラを使用します。
[ストアド プロシージャ] を右クリックし、[新しいストアド プロシージャの追加] をクリックします。
メモ :[新しいストアド プロシージャの追加] 機能は Visual Web Developer 2005 Express Edition ではサポートされていません。
新しいストアド プロシージャに次のコードを追加します。既存のコードがあれば、上書きします。
CREATE PROCEDURE EmployeeSales @Employee int AS SELECT SUM([Order Subtotals].Subtotal) AS Total FROM Employees INNER JOIN Orders INNER JOIN [Order Subtotals] ON Orders.OrderID = [Order Subtotals].OrderID ON Employees.EmployeeID = Orders.EmployeeID WHERE (Employees.EmployeeID = @Employee)ウィンドウを閉じ、[はい] をクリックして、ストアド プロシージャを作成します。
メモ :プロシージャを保存すると、CREATE キーワードが ALTER に変わります。
データを提供するストアド プロシージャを作成した後で、次の操作を行います。
ページ上のデータ ソース コントロール。ストアド プロシージャを実行して、結果セットを管理します。
ページ上の、データを表示するためのコントロール。
次の手順では、DetailsView コントロールにデータを表示します。DetailsView コントロールが SqlDataSource コントロールからデータを取得します。
これらの要素は、個別に Web サイトに追加できます。ただし、最も容易な方法は、DetailsView コントロールにデータを表示し、ウィザードを使用して接続およびデータ ソース コントロールを作成することです。次の手順では、ページにデータを表示するために必要な要素の作成方法を説明します。
次の手順では、GridView コントロールで行を選択できるようにします。選択された行によって、ストアド プロシージャに渡される従業員 ID が決まります。
GridView コントロールで行の選択を有効にするには
GridView コントロールを右クリックし、[スマート タグの表示] をクリックします。
[GridView タスク] ペインの [選択を有効にする] チェック ボックスをオンにします。
次に、ストアド プロシージャの結果セットを表示するコントロールを作成します。
データを表示するために DetailsView コントロールを追加および設定するには
Default.aspx ページに切り替えるか、Default.aspx ページを開いて、デザイン ビューに切り替えます。
ツールボックスの [データ] グループから、DetailsView コントロールをページにドラッグします。
[DetailsView タスク] メニューの [データ ソースの選択] ボックスの [新しいデータ ソース] をクリックします。
[データ ソース構成ウィザード] ダイアログ ボックスが表示されます。
[データベース] をクリックし、[OK] をクリックします。
これで、データを SQL Server データベースから取得するように指定しました。
[データ ソースに ID を指定します] ボックスに、既定のデータ ソース コントロール名が表示されます (SqlDataSource2)。この名前は変更する必要はありません。
データ ソースの構成 - SqlDataSource2 ウィザードに接続を選択するためのページが表示されます。
[アプリケーションがデータベースへの接続に使用するデータ接続] ボックスに、前に作成した接続名を入力し、[次へ] をクリックします。
[カスタム SQL ステートメントまたはストアド プロシージャを指定する] をクリックし、[次へ] をクリックします。
[カスタム ステートメントまたはストアド プロシージャを定義します。] ページで、[ストアド プロシージャ] をクリックし、既に作成したストアド プロシージャ (EmployeeSales) をクリックします。
[次へ] をクリックします。
[パラメータの定義] ページが表示されます。
[パラメータ ソース] ボックスの [コントロール] をクリックします。
[ControlID] ボックスの [GridView1] をクリックします。
[クエリのテスト] をクリックして、希望するデータが取得できることを確認します。[パラメータ値のエディタ] ダイアログ ボックスで「1」と入力し、[OK] をクリックします。値 1 は、データベース内の従業員の ID です。データが正しく取得されると、192107.6000 などの値が返されます (データベースのデータが変更された場合は、これと異なる値になることがあります)。
[完了] をクリックします。
ページのテスト
ここでページを実行できます。
ページをテストするには
Ctrl キーを押しながら F5 キーを押してページを実行します。
ブラウザにページが表示されます。GridView コントロールに Employees テーブルのすべてのデータ行が表示されます。
GridView コントロールのデータ行で [選択] リンクをクリックします。
DetailsView コントロールは、選択された行の詳細情報と、選択された従業員の販売総額を計算するストアド プロシージャの結果セットを表示します。
ブラウザを閉じます。
次に行う作業
このチュートリアルでは、SQL Server のストアド プロシージャと共にデータ ソース コントロール使用して、ASP.NET Web ページにデータを表示する方法を学習しました。ストアド プロシージャの操作方法は、SqlDataSource コントロールで他の SQL ステートメントを使用する場合とほとんど同じです。さらに、ストアド プロシージャには、Web ページ上の値に関連付けられたパラメータを使用できるという利点があります。それ以外にも、ストアド プロシージャを使用すると、SQL ステートメントを使用してデータ関連の機能を実行することにより、以下のようなシナリオを実行できます。
参照
処理手順
方法 : データ ソース コントロールを使用するときに接続文字列をセキュリティ保護する