Visual Web Developer 2005 Express Edition と SQL Server 2005 Express Edition による Web 開発 (第 3 部)
Visual Web Developer Express と SQL Server Express によるデータ ドリブンの Web サイトの構築
Dan Burman
Citigate Hudson
July 2004
日本語版最終更新日 2004 年 12 月 7 日
対象 :
Visual Web Developer 2005 Express
Edition
SQL Server 2005 Express
Edition
Visual Basic 2005 Express
Edition
ASP.NET 2.0
概要 : この資料は、Visual Web Developer 2005 Express Edition と SQL
Server 2005 Express Edition による Web アプリケーションの作成に関する 3 部構成の資料の第 3
部です。この資料では、マスタ ページとコンテンツ
ページの作成、SiteMapDataSource、TreeView、SiteMapPath
などのナビゲーション コントロールの使用、および ObjectDataSource コンポーネントを使用してデータ コンポーネントと
Web インターフェイスをリンクする方法について説明します。また、GridView コントロールと
DetailsView コントロールを使用した作業についても説明します。
注 この資料は、2004 年 5 月時点の
Visual Web Developer Express Edition のアルファ リリースと SQL Server 2005 Express
Edition に基づいています。ここに記載される情報は変更される可能性があります。
関連サンプル コード ExpressWebDevelopment.exe
(英語) のダウンロード
目次
はじめに
マスタ ページとコンテンツ ページ
ナビゲーション
パブリック ページ
履修科目のメイン ビュー
履修科目の追加
FormView コントロールと DetailsView コントロール
履修科目の登録
履修科目の登録状況
配置
まとめ
はじめに
この資料は、複数の資料で構成されている資料の第 3 部です。ここでは Visual Web Developer (Visual Studio
2005) と SQL Server Express を使用して学生が履修科目を登録するためのデータ ドリブンのシンプルな Web
サイトのビルドについて説明します。学生が履修科目を登録したり、登録した履修科目の予定表を表示するアプリケーションを構築します。管理者は、新しい履修科目をシステムに追加したり、既存の履修科目への登録状況を参照できます。また、このサイトには、学内行事が掲載される公共のページもあります。
やるべきことはたくさんあるので、早速、本題に入りましょう。
マスタ ページとコンテンツ ページ
これまで、Web 開発者は、外観が同じ Web ページを作成するのに苦労してきました。ここでビルドする Web サイトでは、各ページにヘッダー
セクション、ナビゲーション セクション、コンテンツ セクション、およびフッター セクションが含まれる一連のページを使用します。一貫性のあるルック
アンド フィールを持つ Web サイトを作成するという目的を達成するために、同一のヘッダー セクション、ナビゲーション セクション、およびフッター
セクションが含まれ、コンテンツ セクションだけが異なるページを作成します。ASP.NET 2.0
を使用すると、この目的は簡単に達成できますが、それについて説明する前に、これまでに Web デザイナがテンプレート ドリブンの Web
サイトを考案する際に直面していた問題について簡単に振り返ってみましょう。
従来、HTML のみを使用して、このような一貫性のある Web
サイトをビルドするには、各ページの外観を同じデザインするか、またはフレームを使用する必要がありました。種類によってはフレームをサポートしていないブラウザもあり、サポートされていてもブラウザによって表示形式が異なるので、得策ではありませんでした。HTML
を使用して同じ外観のヘッダー、フッター、およびナビゲーション セクションを持つように各ページをデザインした場合の問題は、メンテナンスでした。Web
サイトが複数のページで構成されている場合に、あるヘッダー セクションを変更すると、そのヘッダー
セクションを含むすべてのページを変更する必要がありました。このような作業を行わずにサイトの一貫性を保つため、テンプレート処理の集中管理に向けて大きな動きがありました。
クリエイティブな ASP 開発者やユーザーは、サーバー側インクルード (SSI) ファイルを使用して、ページ セクション
コンテンツの集中管理を実現しました。再利用するセクションごとに SSI ファイルを作成し、各コンテンツ
ページから該当ファイルを呼び出していました。これは間違いなく正しい方向に進んでいる動きでしたが、これらのファイルを編集する際のデザイン
サポートがなく、パフォーマンスのオーバーヘッドがあるという問題がありました。
ASP.NET 1.X
では、テンプレートのデザインが改善されました。開発者は、再利用可能な各セクションのすべての機能を含むコンパイル済みのユーザー
コントロールを作成して、これらのコントロールを各フォームにドロップできるようになりました。各機能は集中管理できるようになりましたが、開発者は、依然として手作業でコントロールを各フォームに追加する必要がありました。セクションの配置を変更する場合にも、開発者は、各フォームでセクションの配置を変更する必要がありました。また、デザイン
サポートの問題は未解決のままでした。このユーザー コントロールは、灰色の四角形として表示され、内容は表示されませんでした。
ASP.NET 2.0 の登場により、開発者は "マスタ ページ" と "コンテンツ ページ"
という概念を知ることになりました。これらの概念により、開発者がテンプレート ドリブンの Web デザインを行う方法が大幅に変化するでしょう。マスタ
ページは、<%@ Master %> ディレクティブを含み、.master ファイル拡張子を持つ標準的な ASP.NET
ページです。以下に <%@ Master %> ディレクティブの例を示します。
<%@ Master Language="VB" CompileWith="BaseForm.master.vb"
AutoEventWireup="false" ClassName="BaseForm_master"
EnableTheming="true" %>
マスタ ページでは、マスタ ページを採用しているすべてのページで準拠する基礎となるテンプレートが提供されています。マスタ
ページのレイアウトを採用しているページは "コンテンツ ページ" と呼びます。各マスタ
ページには、ContentPlaceHolder コントロールのインスタンスが少なくとも 1
つ含まれている必要があります。また、コンテンツ ページには、マスタ ページの ContentPlaceHolder
コントロールにマップされる Content コントロールが含まれている必要があります。コンテンツ ページでは、<%@
Page %> ディレクティブの MasterPageFile="" 属性を使用して、マスタ
ページを参照しています。以下にこのディレクティブの例を示します。
<%@ Page Language="VB" MasterPageFile="~/MasterPages/BaseForm.master"
Title="Activity Roster" %>
ASP.NET 2.0 でテンプレート処理を行う利点の 1 つには、Visual Web Developer 2005 Express
Edition でコンテンツ ページを編集する際に視覚的なサポートを得られることがあります。Visual Web Developer 2005
Express Edition の IDE でコンテンツ ページを表示すると、フォームのマスタ ページ セクションは淡色表示になり、コンテンツ
ページのコンテンツ セクションだけが、アクティブな状態で表示されます。そのため、開発者は、Content
コントロールにコントロールをドラッグ アンド ドロップして、コンテンツ フォームを適切にデザインできます。
このシリーズの第 1 部では、BaseForm.master という名前の基本的なマスタ
ページを作成しました。このページには、LoginView コントロールを追加し、AnonymousTemplate に
Login
コントロールを埋め込みました。ここでは、このページに改良を加えて、より魅力的な外観と操作性を提供するようにましょう。これを行うには、このマスタ
ページに 4 行 ｘ 3 列の HTML のテーブルを配置します。次に、1 行目、2 行目、および 4
行目のすべてのセルを行単位で結合します。このようにセルを結合すると、この基本的なマスタ ページが、ここで使用するマスタ
ページと同じ構造になります。第 1 部で追加した LoginView コントロールを 3 行目の 1
つ目のセルにドラッグして、ContentPlaceHolder コントロールを 3 行目の 3 つ目のセルにドラッグします。
.jpg)
図 1. Visual Web Developer 2005 Express Edition デザイナで表示したマスタ
ページ
ナビゲーション
わかりやすく適確なレイアウトの Web デザインの作成において、ナビゲーションは最も重要な要素ですが、ASP.NET 2.0
を使用すると、ナビゲーションは簡単に作成できます。ASP.NET 2.0 では、ナビゲーションをサポートするいくつかの新しい Web
コンポーネントが導入されました。ここでは、サイト マップ、SiteMapDataSource
コントロール、SiteMapPath コントロール、および TreeView コントロールについて説明します。
ASP.NET 2.0 では、サイト マップという概念が導入されました。これは、サイト内のすべてのナビゲーション リンクを含む XML
ファイルです。新しいサイト マップを作成するには、ソリューション エクスプローラで、Web サイトのルート フォルダを右クリックして、新しいサイト
マップを追加します。ここでは、既定の名前 Web.sitemap を使用します。サイト マップが表示されると、複数の
<siteMapNode> 要素が入れ子になった 1 つの <sitemap> 要素を含む
XML ファイルが表示されます。このファイルに以下のノードを入力します。
<?xml version="1.0" encoding="utf-8" ?>
<siteMap>
<siteMapNode url="~/default.aspx" title="Home"
description="" roles="*">
<siteMapNode url="~/ContentPages/Activity.aspx"
title="Activities" description="" roles="*" >
<siteMapNode url="~/ContentPages/ActivityViewAll.aspx"
title="View All Activities" description=""
roles="*" />
<siteMapNode
url="~/ContentPages/ActivityViewUser.aspx?iActivityID=-1"
title="View My Activities" description=""
roles="Student" />
</siteMapNode>
<siteMapNode url="~/ContentPages/LoginSignUp.aspx"
title="Create Account" description="" roles="*" />
</siteMapNode>
</siteMap>
<siteMapNode>
要素には、title、description、URL、および roles
属性が用意されています。title 属性は、バインドしたナビゲーション コントロールに表示されるテキスト、URL
属性はユーザーがリンクをクリックしたときの移動先を指定します。roles 属性は、ロール マネージャで管理されているユーザー
ロールと関連付けられている非常に有益な属性です (詳細については、このシリーズの第 1 部の「ロール
マネージャによるロールのセットアップ」を参照してください)。ここでは、アプリケーションで Administrator と Student の 2
種類のロールがサポートされていることを把握しておく必要があります。ログインしたユーザーが Administrator
ロールにアクセスできる場合、そのユーザーには、サイト マップで roles="administrator"
属性値が設定されているすべてのリンクが表示されます。この属性値を使用すると、開発者はサイト
マップに基づいて、ロールに応じたコンテンツを簡単に表示できるようになります。
Web.sitemap ファイルの設定が完了したら、データ操作を行うデータ ソースを設定する必要があります。BaseForm.master に
SiteMapDataSource コントロールをドラッグ アンド ドロップします (このコントロールは Visual Web
Developer 2005 Express Edition ツールボックスの [Data]
タブにあります)。SiteMapDataSource コントロールは、自動的に Web.sitemap
を指すので、このコントロールを構成する必要はありません。ShowStartingNode プロパティを False
に設定します。この設定により、Web.sitemap のルート ノード (この場合は Home リンク) が非表示になります。
次に、フォームに TreeView コントロールをドラッグ アンド ドロップして、DataSourceID
プロパティを SiteMapDataSource コントロールの DataSourceID
プロパティと同じ値に設定します (TreeView コントロールは、Visual Web Developer 2005 Express
Edition ツール ボックスの [Core] タブにあります)。SiteMapDataSource コントロールは、データ ソース
(Web.sitemap) とグラフィカル インターフェイス (TreeView コントロール)
間で橋渡しの役割を担っています。ShowExpandCollapse プロパティを False
に設定します。この設定により、ユーザーは表示された階層型のデータを展開したり、折りたたんだりすることができなくなります。
次に、フォームに SiteMapPath コントロールのインスタンスをドラッグ アンド
ドロップします。SiteMapPath コントロールは、Web.sitemap ファイルに関連付けられ、"階層リンク"
の追跡が確立されます。階層リンクの追跡は、ユーザーがアプリケーション内のどの位置にいるのかを明確に示すのに不可欠なナビゲーション
ツールです。ユーザーが特定のページに辿り着くまでに入り組んだリンクを使用した結果、ユーザーがアプリケーション内のどの位置にいるのか、どのようにしてそのページに辿り着いたのかがわからなくなってしまうことがあります。階層リンクでは、ユーザーが現在の位置に辿り着くまでに使用した経路が明確に表示されます。
パブリック ページ
マスタ ページが完成したので、今度は、このサイトにコンテンツ ページを追加してみましょう。最初に追加する画面は、パブリック
インターフェイスのフォームです。サイトにログインせずに履修科目に関する情報を収集したいユーザーは、このページから履修科目の概略を入手できます。このページは、いくつかの静的なコンテンツとデータ
ドリブンの表で構成されています。データ
ドリブンの表には、登録済みの学生が使用できる公開済みの全履修科目が表示されます。このページの表示に必要なログイン資格情報はありません。
.jpg)
図 2. 履修科目のパブリック ページのデザイン ビュー
コンテンツ ページを追加するには、ソリューション エクスプローラで、プロジェクトの [ContentPages]
フォルダを右クリックし、[Add New Item] を選択して、[Web Form] を選択します。[Place code in separate
file] チェック ボックスと [select master page] チェック
ボックスがオンになっていることを確認します。ファイル名を「Login.aspx」に変更して、[OK] をクリックします。
1 つ目のチェック ボックスは、インライン コードではなく、分離コードを使用することを指定しています。分離コードとは、追加したコードが
"パーシャル クラス" と呼ばれる別のファイルに保存されることを意味します。インライン コードの代わりに分離コードを使用すると、2
つの大きな利点があります。まず、分離コードでは、コードが明確に分けらます。プレゼンテーション層を処理するすべてのソース コードは 1
つのファイルに格納され、サーバー コードは別のファイルに格納されます。分離コードを使用するもう 1 つの利点は、複数の開発者が開発に携わっていても
1 つの Web フォームの開発を同時に行えることです。ある開発者が .ASPX フォームを使用してフォームの外観を、別の開発者が分離コード
ファイルを使用してビジネス ロジックの開発を行うことができます。すべてのコードが 1 つのファイルに格納されている場合、2
人の開発者が同時に作業することはできません。
2 つ目のチェック ボックスは、作成する Web ページでマスタ ページが参照されていることから、そのページがコンテンツ
ページであることを示します。[OK] をクリックすると、このコンテンツ ページに対して使用するマスタ
ページを選択する別のウィンドウが表示されます。BaseForm.master ページを選択して、[OK] をクリックします。
このパブリック ページが、"Login.aspx" という名前であることに注目してください。これは、フォーム認証を使用してパブリック
ページを作成する簡単な方法です。この方法を使用すると、認証されていないユーザーは指定のログイン ページにリダイレクトされます。このログイン
ページの構成を変更して、Login コントロールだけではなく、他の必要なコントロールを追加することもできます。パブリック
ページを作成する別の方法には、フォーム認証で保護されていないフォルダを作成する方法があります。その後、サイト内の保護されているフォルダにあるファイルへのリンクを設定して、そのページでユーザーをログイン画面にリダイレクトします。
フォームを作成したら、そのページをデザイナで表示します。BaseForm は淡色表示され、コンテンツ
セクションがアクティブなセクションとして表示されます。このセクションに、ページのコンテンツを設定します。[Property]
ウィンドウに移動して、オブジェクトの一覧から DOCUMENT オブジェクトを選択し、Title プロパティを
「Welcome to the Student Activity Registry」に変更します。コンテンツ ページの Title
プロパティに値を設定すると、その値がブラウザのタイトル バーに表示されます。
Login.aspx のデザイン ビューに戻って、フォームに ObjectDataSource
コンポーネントのインスタンスをドラッグ アンド ドロップし、「odsActivitiesPublished」という名前に変更します。データ
ソースを右クリックして、[Configure Data Source] を選択します。ウィザードで、[ActivitiesTableAdapter]
を選択して、[Next] をクリックします。[Select]、[Update]、[Insert]、および [Delete] という 4
つのタブのある画面が表示されます。パブリック フォームは読み取り専用なので、ここで関係があるのは [Seleclt]
タブだけになります。ドロップダウン メニューをクリックして、[GetActivitiesByPublishing] を選択します (これを選択すると
"ActivitiesDataTable" が返されます)。[Next] をクリックします。[Next]
をクリックすると、定義する必要のあるパラメータが表示されます。[bIsPublished] パラメータを選択して、パラメータ ソースには
[None] を選択し、既定値には [True] を指定します。
これでデータ ソースの構成が完了しました。次は、このデータ ソースをグラフィカル
インターフェイスにバインドして、データを表示する必要があります。ツールボックスの [Data] セクションから GridView
コントロールをドラッグ アンド
ドロップして、「gvActivitiesPublished」という名前に変更し、DataSourceID プロパティを
odsActivitiesPublished に設定します。この操作を行うと、GridView
コントロールは、"ActivitiesDataTable" で定義されているスキーマに準拠するので、データ
テーブル内のすべての列がグリッド内に表示されます。
後、必要な作業は、書式設定のみです。GridView コントロールの列は "ActivitiesDataTable"
のスキーマに沿ってモデリングされているので、列のヘッダーはデータベースと同じヘッダーになります。グリッドのヘッダーの書式を設定するには、GridView
コントロールの Columns コレクション
プロパティをクリックします。この操作により、フィールドの一覧が表示されます。左下にあるリスト
ボックスには、グリッドで選択しているすべてのフィールドの一覧が表示されます。いずれかのフィールドをクリックして、右側で Bound
Field プロパティの値を修正します。列のヘッダー テキストは、HeaderText
プロパティに含まれています。各列名をわかりやすい名前に変更します。列 (たとえば iActivityID など)
を非表示にするには、その列の Visible プロパティを False に設定します。
開発者が、グリッドの書式設定をすばやく行って、グリッドの見栄えをよくできるようにするため、Visual Web Developer 2005
Express Edition には、いくつかのテンプレートが用意されています。グリッドを右クリックして、[Auto Format]
を選択します。定義済みの書式を 1 つ選択します。このアプリケーションでは Slate を使用しました。
履修科目のメイン ビュー
次は、履修科目のメイン
ビュー画面を作成しましょう。この履修科目のメイン画面には、ログインしたユーザーがアクセスできるすべての履修科目が表示されます。管理者の場合は、2
種類の履修科目の表が表示されます。管理者には、公開済みの履修科目の一覧と未公開の履修科目の一覧が表示されます。公開済みの履修科目とは、学生が登録したり、一般の人が閲覧できるように管理者が入力して公開した履修科目です。いったん公開した履修科目を変更することはできません。未公開の履修科目とは、"保留状態"
の履修科目です。これらの履修科目も管理者が追加したものですが、学生が登録したり、一般の人が閲覧することはできません。管理者は、未公開の履修科目を編集することができます。学生には、公開済みの履修科目のうち、未登録の履修科目の一覧のみが表示されます。どちらのユーザー
ロールに対しても、既に終了した履修科目は表示されません。一般の人は、このフォームにはアクセスできません。
また、画面上部には Calendar
コントロールが配置されており、ある特定の日に開講される履修科目をフィルタ選択できます。ユーザーが予定表をクリックするとリンクが使用できるようになり、日付によるフィルタ選択を解除して、すべての日に開講される履修科目を表示できるようになります。
では、履修科目のメイン フォームを作成しましょう。新しいコンテンツ
フォームを作成し、「ActivityViewAll.aspx」という名前を付けて、マスタ ページとして BaseForm.master
を参照します。
コンテンツ ページのコンテンツ ペインに Calendar
コントロールをドロップして、「calActivity」という名前に変更します。2 つの ObjectDataSource
コントロールをドロップします。それぞれに「odsActivitiesPublished」と「odsActivitiesUnpublished」という名前を付けます。「odsActivitiesPublished」という名前を付けた
ObjectDataSource コントロールを構成します。[ActivitiesTableAdapter]
を選択して、[Select] タブで [GetActivitiesByPublishing] を選択します。[Next]
をクリックすると、定義する必要のあるパラメータが表示されます。[bIsPublished] パラメータを選択して、パラメータ ソースには
[None] を選択し、既定値には [True] を指定します。今度は、日付に基づいて履修科目をフィルタ選択できるように
Calendar コントロールの関連付けを行います。これを行うには、[Property] ウィンドウの
FilterParameters コレクション プロパティで [...] ボタンをクリックします。Parameter
Collection Editor が起動したら、[Add Parameter]
ボタンをクリックします。パラメータ名を「dtDateOfActivity」に変更し、パラメータ ソースを [Control]
に設定し、[ControlID] ボックスの一覧の [calActivity] をクリックし、既定値は空のままにします。[OK]
をクリックして、エディタを終了します。次に、[FilterExpression]
フィールドに「dtDateOfActivity='@dtDateOfActivity'」と入力します。odsActivitiesUnpublished
データ ソースについても同様に構成します。ただし、bIsPublished パラメータの既定値は False
に設定します。
データ ソース
コントロールが非常に簡単に使用でき、この機能を組み込むのに開発者が従来記述していたコードが必要ないことには驚きました。以下に、これらの
ObjectDataSource のソース コードを示します。ASP.NET
では、<SelectParameter>
要素を入れ子にすることで、さまざまなパラメータに対応していることに注意してください。
<asp:ObjectDataSource ID="odsActivitiesPublished" Runat="server"
TypeName="ActivitiesTableAdapter"
SelectMethod="GetActivitiesByPublishing"
FilterExpression="dtDateOfActivity='@dtDateOfActivity'">
<FilterParameters>
<asp:ControlParameter Name="dtDateOfActivity"
ControlID="calActivity" PropertyName="SelectedDate">
</asp:ControlParameter>
</FilterParameters>
<SelectParameters>
<asp:Parameter Type="Boolean" DefaultValue="true"
Name="bIsPublished">
</asp:Parameter>
</SelectParameters>
</asp:ObjectDataSource>
<asp:ObjectDataSource ID="odsActivitiesUnpublished" Runat="server"
TypeName="ActivitiesTableAdapter" SelectMethod="GetActivitiesByPublishing"
FilterExpression="dtDateOfActivity='@dtDateOfActivity'">
<FilterParameters>
<asp:ControlParameter Name="dtDateOfActivity"
ControlID="calActivity" PropertyName="SelectedDate">
</asp:ControlParameter>
</FilterParameters>
<SelectParameters>
<asp:Parameter Type="Boolean" DefaultValue="false"
Name="bIsPublished">
</asp:Parameter>
</SelectParameters>
</asp:ObjectDataSource>
このようにデータ ソースを構成することによって、次のことを実現しました。まず、両方のデータ ソースでは、データ ソースの
FilterParameters コレクション プロパティを使用して、データ ソースの dtDateOfActivity
フィルタ パラメータと予定表の calActivity
で選択された値の間にリンクを設定しました。FilterExpression
プロパティでは、予定表から取得されたパラメータ値が評価され、データ ソースの dtDateOfActivity
フィールドの値と比較されます。この値が一致したレコードが表示されます。予定表で値が選択されていない場合は、フィルタにより、すべてのレコードが返されます。ただし、日付が選択されている場合は、FilterExpression
により、返されたレコードが日付でフィルタ選択されます。odsActivitiesPublished については、値
True が設定された bIsPublished
パラメータが渡され、odsActivitiesUnpublished については、値 False が設定された
bIsPublished パラメータが渡されます。このように、各データ ソースには、異なる結果セットが返されます。
次は、フォームに hyperlink をドロップして、「lnkShowAllActivities」という名前に変更します。このコントロールの
Text プロパティを「Show available activities for all
dates」に設定します。NavigateUrl プロパティを
~/ContentPages/ActivityViewAll.aspx に設定し、Visible プロパティを
False に設定します。
.jpg)
図 3. lnkShowAllActivities の [Properties] ウィンドウ
今度は、このデータを表示する方法を設定する必要があります。フォームに LoginView
コントロールをドロップして、「lvActivity」という名前に変更します。このシリーズの第 1
部で説明したように、LoginView
コントロールは匿名ユーザーやログインしているユーザーに適用できるだけではなく、ロール単位で適用することもできます。この
LoginView コントロールに 2 つのロールを追加して、学生と管理者に別のコンテンツを表示できるようにしましょう。
ロールを追加するには、LoginView コントロールの RoleGroups コレクション
プロパティをクリックします。[Add] ボタンをクリックして、"Administrator" ロールを追加します。"Student"
ロールについても同じ操作を行い、[OK] をクリックします。
LoginView コントロールを右クリックして、[Edit Template] を選択すると、"RoleGroup [0] –
Administrator" と "RoleGroup [1] – Student" という 2
つの新しいテンプレートが表示されるようになります。
[RoleGroup [0] – Administrator] テンプレートを選択します。このテンプレートに 2 つの
GridView
コントロールをドロップして、それぞれ「gvPublished」と「gvUnpublished」という名前に変更します。gvPublished
コントロールの DataSourceID プロパティを odsActivitiesPublished
に設定し、gvUnpublished コントロールの DataSourceID プロパティを
odsActivitiesUnpublished に設定します。DataKeyNames プロパティを
iActivityID に設定します。DataKeyNames
プロパティでは、テーブル内でキーとして定義する列を指定します。これらの GridView
コントロールからデータを渡すので、この設定は重要です。また、両方のテーブルで、AutoGenerateSelectButton
プロパティを True に設定します。Columns コレクション
プロパティで、列のヘッダーの名前を変更します。
.jpg)
図 4. 履修科目のメイン フォームの管理者用ビュー
管理者が公開済み履修科目への登録状況を確認できる機能も組み込みたいと思います。この登録状況の一覧は別の画面で処理されるので、管理者が、この登録状況の画面を表示するためのリンクを作成します。これを行うには、gvPublished
コントロールの [Property] ウィンドウを表示して、Columns コレクション プロパティをクリックします。ポップアップ
ウィンドウの左上隅に表示された使用できるフィールドの一覧から、[Hyperlink] フィールドを選択して、[Add]
をクリックします。この操作により、選択したフィールドの一覧に新しく Hyperlink
フィールドが追加されます。上矢印を使用して、このフィールドを一覧の先頭に移動します。[hyperlink]
列を選択した状態で、text プロパティを「Roster」に変更し、DataNavigateUrlFields
プロパティを iActivityID に変更し、DataNavigateUrlFormatString プロパティを
~/ContentPages/ActivityRoster.aspx?iActivityID={0}
に変更します。ここで設定した最後の 2 つのプロパティは連動しており、ユーザーが [Roster] リンクをクリックしたときにリダイレクトされる
URL を構築します。DataNavigateUrlFields プロパティを iActivityID
に設定すると、リンクはその行の基になるキー フィールドにマップされます。DataNavigateUrlFormatString
プロパティに ~/ContentPages/ActivityRoster.aspx?iActivityID={0}
を設定することによって、URL
の形式を設定しています。ブラウザでコントロールが表示されると、コントロールにより、DataNavigateUrlFormatString
プロパティに設定されている {0} は特定のレコードの iActivityID
の値に置き換えられます。その結果、ユーザーには登録状況画面が表示され、ここで選択されている履修科目と一致するクエリ文字列の値が渡されます。
gvPublished コントロールの [Properties] ウィンドウに移動して、[Events] ボタン
(稲妻のアイコン) をクリックします。SelectedIndexChanged
イベントをダブルクリックします。この操作により、ユーザーが GridView コントロールの Select
リンクをクリックしたときに発生するイベント ハンドラが設定された空のイベント コード シェルが作成されます。gvUnpublished
コントロールについても、同じ操作を行います。
分離コード ファイルを開きます。このファイルを開くには、ソリューション エクスプローラで、ActivityViewAll.aspx
を右クリックして、[View Code] をクリックします。この操作により、パーシャル クラスの "ActivityViewAll_aspx"
が呼び出されます。gvPublished_SelectedIndexChanged と
gvUnpublished_SelectedIndexChanged の空のイベント内に、以下のコードを入力します。
Response.Redirect("~/ContentPages/ActivityAddEdit.aspx?iActivityID=" &
CType(sender, System.Web.UI.WebControls.GridView).DataKeys.Item(
CType(sender, System.Web.UI.WebControls.GridView).SelectedIndex)
.Value.ToString)
このコードでは、選択したキーのインデックスを取得して、そのインデックスを URL の末尾のクエリ文字列に追加します。このクエリ文字列の値
iActivityID は、呼び出し側のフォーム ActivityAddEdit.aspx で取得されます。
最後に、LinkButton コントロールを追加して、「lnkActivity」という名前に変更します。このコントロールの
Text プロパティを「Add a new activity」に設定し、PostBackUrl プロパティを
~/ContentPages/ActivityAddEdit.aspx?iActivityID=-1 に設定します。
これで、管理者用の表の機能が完了しました。今度は、学生用の表についても同様の機能を作成する必要があります。LoginView
コントロールを右クリックして、[RoleGroup [1] – Students] テンプレートを選択します。このテンプレートに
GridView コントロールをドロップして、「gvStudent」という名前に変更します。DataSourceID
プロパティを odsActivitiesPublished に設定し、DataKeyNames プロパティを
iActivityID に設定し、AutoGenerateSelectButton プロパティを True
に設定します。Column コレクション プロパティで、列のヘッダーの名前を変更します。
.jpg)
図 5. 履修科目メイン フォームの学生用ビュー
gvStudent コントロールの SelectedIndexChanged
イベントをダブルクリックして、空のコード シェルとイベント ハンドラを生成します。分離コード
ファイルを開いて、gvStudent_SelectedIndexChanged 内に以下の行のコードを挿入します。
Response.Redirect("~/ContentPages/ActivityViewUser.aspx?iActivityID=" &
CType(sender, System.Web.UI.WebControls.GridView).DataKeys.Item(
CType(sender, System.Web.UI.WebControls.GridView).SelectedIndex)
.Value.ToString)
このコードは、基本的に gvPublished_SelectedIndexChanged と
gvUnpublished_SelectedIndexChanged
のイベントと同じ処理を行いますが、学生は別のページにリダイレクトされます。
後、このページについて行う必要があることは、予定表の SelectionChanged
イベント用のイベントを作成するだけです。このイベント内に、以下のコードを挿入します。
lnkShowAllActivities.Visible = True
このコードにより、特定の日付が選択された場合に、lnkShowAllActivities
リンクが表示されるようになります。
履修科目の追加
今度は、管理者が新しい履修科目を追加したり、既存の履修科目を編集または削除するためのフォームを作成しましょう。これまでと同様に新しいコンテンツ
ページを追加し、このページに「ActivityAddEdit.aspx」という名前を付けます。ページに
ObjectDataSource をドラッグ アンド ドロップし、「odsActivity」という名前に変更します。データ
ソースを右クリックし、[Configure Data Source] を選択します。[ActivitiesTableAdapter]
を選択し、[Next] をクリックします。[Select] タブで、GetActivitiesByID
メソッドを選択します。ここでは一度に 1 つの履修科目しか参照しないので、このメソッドを選択します。[Update]
タブで、UpdateActivity メソッドを選択します。[Insert] タブで、AddActivity
メソッドを選択します。[Delete] タブで、RemoveActivity メソッドを選択します。[Next]
をクリックします。この時点で、開発者は、select ステートメントに必要なパラメータを定義する必要があります。左側にあるパラメータの一覧には 1
つのパラメータ iActivityID が表示されます。このパラメータを選択し、パラメータの一覧の右側で、パラメータ ソースとして
[QueryString] を選択し、[QueryStringField]
フィールドに「iActivityID」と入力します。既定値を指定する必要はありません。[Finish] をクリックします。次は、[Property]
ウィンドウに移動して、OldValuesParameterFormatString プロパティの値を
original_{0} から {0} に変更します。このプロパティは、iActivityID
パラメータの名前をマスクして、original_ というプレフィックスを追加するためのものです。ただし、ここではストアド
プロシージャで @original_iActivityID
という名前のパラメータを受け取ることを想定していないので、このプロパティからプレフィックスを削除します。
この設定を行うと、フォームは履修科目のメイン
フォームからのみ呼び出されるようになります。フォームは、公開済み、または未公開のグリッドのいずれかの [select]
リンクをクリックするか、または管理者が使用できる [Add a new activity]
リンクのいずれかをクリックすることで呼び出されます。これらの各イベントでは、管理者がこのフォームにリダイレクトされるようにしました。ActivityViewAll.aspx
の gvPublished_SelectedIndexChanged イベントと
gvUnpublished_SelectedIndexChanged イベントでは、ユーザーをリダイレクトする前に URL に
?iActivityID={グリッドから選択された値} を追加しました。また、lnkActivity
コントロールでは、PostBackUrl プロパティの URL に ?iActivityID=-1
を追加しました。メイン フォームが現在のフォーム (ActivityAddEdit.aspx) にリダイレクトされると、URL
にはクエリ文字列の値が追加されています。これは、ブラウザのアドレス
バーで確認できます。<asp:QueryStringParameter> により、iActivityID
のクエリ文字列フィールドの値が解析され、この値がデータ ソースの select メソッドに渡されます。以下に、select
メソッドのパラメータを生成するソース コードを示します。
<SelectParameters>
<asp:QueryStringParameter Name="iActivityID"
QueryStringField="iActivityID" Type="Int32">
</asp:QueryStringParameter>
</SelectParameters>
FormView コントロールと DetailsView
コントロール
データ ソースを適切に構成したので、今度は、選択したレコードの値を表示したり、編集したりするためのグラフィカル
インターフェイスを追加する必要があります。ASP.NET 1.1 では、行のフィールドごとに一連のテキスト
ボックスとラベルを追加して、フィールドを基になるデータ セットの列にバインドする必要がありました。ASP.NET 2.0
では、FormView コントロールと DetailsView コントロールという 2
つの新しいコントロールが導入されたことによって、フォーム
ビューでレコードを表示する作業が大幅に簡略化されました。どちらのコントロールでも、基になるデータ スキーマの各レコードを一度に 1
つずつ縦割りに表示する方法が提供されています。FormView
コントロールでは、<フィールド名>:<値>
の形式でデータの読み取り専用ビューが提供されます。これは、1
つのレコードの詳細のみを表示する必要がある場合に適したコントロールです。DetailsView
コントロールは、読み取り専用に制限されていない、<フィールド名>:<値>
の形式でコンテンツを表示する優れたコントロールです。このコントロールは、この読み取り専用のビューを備えている以外に、データ ソースの
insert、update、および delete
メソッドと関連付けられており、ユーザーはさまざまなモードでデータを操作できます。"Read-Only" モードの場合、このコントロールの外観は
FormView コントロールのようになります。このコントロールは、フィールド名が左側、値のラベルが右側に並んで表示される 2
列のテーブルです。
ユーザーがコントロールに表示される [Edit] リンクをクリックすると、コントロールは "Edit" モードになります。コントロールが
Edit
モードになると、フィールドの値はラベルではなくなります。ラベルは、レコードの値が読み込まれた状態の編集可能なコントロールになります。レコードを編集したら、ユーザーは編集内容を更新
(Update) またはキャンセル (Cancel) できます。ユーザーが [Update] をクリックすると、コントロールではデータ ソースの
Update
メソッドが発生し、編集内容が直ちに保存されます。更新またはキャンセルのいずれかが行われると、DetailsView コントロールは
"Read-Only" モードに戻ります。
このコントロールには [New]
リンクを表示することもできますが、ユーザーがこのリンクをクリックすると、テーブルの一連のフィールド値の列が空の編集可能なコントロールになります。ユーザーは、新しいレコードの詳細情報を入力したら、挿入
(Insert) またはキャンセル (Cancel) のいずれかの操作を選択できます。ユーザーが [Insert]
をクリックすると、コントロールではデータ ソースの Insert
メソッドが発生し、編集内容が直ちに保存されます。挿入またはキャンセルのいずれかの操作が行われると、DetailsView
コントロールは "Read-Only" モードに戻ります。
削除するオプションを提供した場合、ユーザーは DetailsView コントロールからレコードを削除することもできます。
コントロールが "Read-Only" のときに、ユーザーが [Delete] をクリックすると、コントロールではデータ ソースの
Delete メソッドが発生し、レコードが直ちに削除されます。
履修科目を挿入、編集、および削除する必要があるので、DetailsView
コントロールを使用します。DetailsView コントロールの新しいインスタンスを、フォームのコンテンツ
ペインにドロップして、「dvActivity」という名前に変更します。DataSourceID プロパティを
odsActivity に設定し、DataKeyNames プロパティを iActivityID
に設定します。AutoGenerateDeleteButton、AutoGenerateEditButton、および
AutoGenerateInsertButton プロパティを True
に設定します。これらのプロパティは、Edit、Delete、および New
コントロールのリンクを生成するためのものです。ストアド プロシージャまたは動的 SQL
を使用して、データベースのレコードを表示、編集、更新、および削除する機能を設定するのに必要な作業は、これですべてです。
今度は、このアプリケーションでフォームがスムーズに動作するようにするために、数行のコードを追加します。dvActivity の
[Properties] ウィンドウの [Events] ペイン (稲妻)
に移動します。ItemDeleted、ItemInserted、および ItemUpdated
イベントをそれぞれダブルクリックして、空のコード シェルとイベント ハンドラを生成します。その後、各イベント内に、以下に示す
RedirectToViewAll メソッドを呼び出すコードを記述します (このメソッドは、分離コード
ファイルに挿入する必要があります)。
Sub RedirectToViewAll()
Response.Redirect("~/ContentPages/ActivityViewAll.aspx")
End Sub
このメソッドで行う処理は、ユーザーを履修科目のメイン
ページに移動するだけです。レコードを削除した後に、このメソッドを呼び出さないと、空のページが表示されたままになるので、ItemDelete
イベントでは、このメソッドの呼び出しが非常に重要になります。ItemInsert イベントや ItemUpdate
イベントの場合、このメソッドの呼び出しは、ItemDelete
イベントの場合ほど重要ではありませんが、ユーザーにレコードの更新や挿入処理が正常に行われたことを示すことは適切な処置です。
後は、以下のコードをフォームの LoadComplete イベントに記述する必要があります。
' クエリ文字列の iActivityID に値 -1 が設定されている場合、
' iActivityID は新しい履修科目を追加するリンクから渡された
' ことになります。ここでは、データ ビューの defaultMode に
' DetailsViewMode.Insert を設定します。
If Not Page.IsPostBack And Request.QueryString("iActivityID") = "-1" Then
dvActivity.DefaultMode = DetailsViewMode.Insert
End If
このコードは、フォームが初めて読み込まれた後に、クエリ文字列で値 -1 が iActivityID
に渡されている場合、このフォームが履修科目のメイン フォームの [Add a new activity]
リンクをクリックして、読み込まれたことを示します。この場合、DetailsView コントロールの既定のモードを
DetailsViewMode.Insert に設定します。この設定により、フォームは "Insert" モードにキャストされます
(フォームには空の編集可能なコントロールが設定されます)。このコードは、フォームの Load
イベントではなく、LoadComplete イベントに記述しました。これは意図的な措置です。現在リリースされている Visual
Web Developer 2005 Express Edition のビルドでは、このコードを Load
イベントに記述すると、DetailsView コントロールがバインドされたデータ
ソースにデータが読み込まれていない場合、DetailsView
コントロールが表示されません。ただし、LoadComplete イベント内で DefaultMode
プロパティを設定すると、代わりに空の DetailsView
コントロールが表示され、新しい履修科目を入力するインターフェイスが提供されます。
新しい履修科目を入力する際には、ユーザーは Activity ID
の値を挿入する必要があります。新しいレコードを入力する際には、[Activity ID] フィールドに [0]
を設定します。レコードを保存すると、その履修科目には、次に利用できる一連の ID に基づいて新しい ID が発行されます。データベースで ID が
auto increment に設定されている場合にユーザーがレコードのプレースホルダ ID
を入力する必要があるのは奇妙だと思われるでしょうが、この値を指定しないとレコードを挿入できません。レコードを挿入する実用的な方法を模索してみましたが、見つけられませんでした。
.jpg)
図 6. 履修科目を追加、編集、削除するためのフォームのデザイン ビュー
.jpg)
図 7. 履修科目を追加、編集、削除するためのフォーム ("Read-Only" モード)
.jpg)
図 8. 履修科目を追加、編集、削除するためのフォーム ("Edit" モード)
.jpg)
図 9. 履修科目を追加、編集、削除するためのフォーム ("Insert" モード)
履修科目の登録
このアプリケーションの重要な機能の 1
つには、学生が履修科目を登録したり、アクセスできる履修科目の登録を解除できるようにすることがあります。これが次に実装する機能になります。
新しいコンテンツ ページを追加し、このページに「ActivityViewUser.aspx」という名前を付けます。コンテンツ ページに 2
つの ObjectDataSource
を追加して、それぞれ「odsStudent」と「odsActivity」という名前に変更します。odsActivity
を構成します。[ActivitiesTableAdapter] を選択し、[Next] をクリックします。[Select]
タブで、GetActivitiesByID メソッドを選択して、[Next]
をクリックします。パラメータを設定する際には、iActivityID のパラメータ ソースには QueryString
が設定され、QueryStringField には iActivityID
が設定されている必要があります。これらの構成作業が完了したら、[Finish] をクリックします。
次に、odsStudent を構成します。[StudentActivitiesTableAdapter] を選択し、[Next]
をクリックします。[Select] タブで GetActivitiesByUser メソッドを選択し、[Insert] タブで
AddEnrollment メソッドを選択し、[Delete] タブで RemoveEnrollment
メソッドを選択します。[Next] をクリックします。パラメータの一覧で、UserName パラメータのパラメータ ソースには
Session が設定され、Session 変数には UserName
が設定されている必要があります。[Finish] をクリックします。次は、[Property]
ウィンドウに移動して、OldValuesParameterFormatString プロパティの値を
original_{0} から {0} に変更します。このプロパティは、iUserActivityID
パラメータの名前をマスクして、original_ というプレフィックスを追加するためのものです。ただし、ここではストアド
プロシージャで @original_iUserActivityID
という名前のパラメータを受け取ることを想定していないので、このプロパティからプレフィックスを削除します。
UserName パラメータでは、ページの読み込み時に定義する Session 変数からパラメータ
ソースを取得します。Page_Load イベントに、以下のコードを記述します。
If Not Page.IsPostBack Then
Session("UserName") = Membership.GetUser.UserName
End If
このコードでは、フォームが初めて読み込まれたときに UserName という名前の Session
変数が読み込まれます。この変数により、データ ソースで収集されたデータが処理されます。
両方のデータ ソースの設定が完了したので、これらのデータ ソースにいくつかのコントロールをバインドしてみましょう。まず、フォームに
DetailsView コントロールをドロップして、「dvActivity」という名前に変更します。このコントロールの
DataSourceID プロパティを odsActivity に設定し、DataKeyNames
プロパティを iActivityID に設定します。Fields コレクション
プロパティに移動して、iActivityID と iTotalSlots の Visible プロパティを
False に設定します。他のフィールドの HeaderText プロパティを適切な名前に変更します。
DetailsView コントロールの下にボタンをドロップして、「btnEnroll」という名前に変更し、Text
プロパティを「Enroll」に設定します。ボタンをダブルクリックして、分離コード ファイルにイベント プロシージャ スタブを生成します。空の
btnEnroll_Click イベント コード シェル内に、以下のコード行を記述します。
学生が、このボタンをクリックすると、odsStudent の Insert
メソッドが発生し、学生は選択した履修科目を登録することになります。
次に、コンテンツ ペインに GridView
コントロールをドロップし、「gvStudent」という名前に変更します。このコントロールの DataSourceID プロパティを
odsStudent に、DataKeyNames プロパティを iUserActivityID
に、AutoGenerateDeleteButton プロパティを True に設定します。Columns
コレクション プロパティに移動して、iUserActivityID、iActivityID、および
iTotalSlots の Visible プロパティを False に設定します。残りの列の
HeaderText プロパティも、適切な名前に変更します。
学生が [delete] リンクをクリックすると、odsStudent の Delete
メソッドが発生し、その学生は選択した特定の履修科目の登録を解除することになります。
.jpg)
図 10. 学生用登録フォームのデザイン ビュー
.jpg)
図 11. 学生用登録フォームのブラウザ ビュー
履修科目の登録状況
この資料で構築する最後の画面は、登録状況の画面です。この画面では、管理者は特定の履修科目に登録している学生の一覧を参照できます。
新しいコンテンツ ページを追加し、このページに「ActivityRoster.aspx」という名前を付けます。コンテンツ ページに 2 つの
ObjectDataSource
を追加して、それぞれ「odsStudent」と「odsActivity」という名前に変更します。odsActivity
を構成します。[ActivitiesTableAdapter] を選択し、[Next] をクリックします。[Select]
タブで、GetActivitiesByID メソッドを選択して、[Next]
をクリックします。パラメータを設定する際には、iActivityID のパラメータ ソースには QueryString
が設定され、QueryStringField には iActivityID
が設定されている必要があります。[Finish] をクリックします。以前と同様に、iActivityID
のクエリ文字列の変数に値を渡します。この値は、表示する履修科目を指定する Select メソッドに渡されます。
次に、odsStudent を構成します。[StudentActivitiesTableAdapter] を選択し、[Next]
をクリックします。[Select] タブで、GetActivitiesByRoster メソッドを選択して、[Next]
をクリックします。パラメータの一覧で、iActivityID パラメータのパラメータ ソースに QueryString
が設定され、QueryStringField には iActivityID
が設定されている必要があります。[Finish] をクリックします。Select
メソッドが実行されると、StudentActivitiesTableAdapter
により、指定された履修科目に現在登録している学生の一覧が返されます。
両方のデータ ソースの設定が完了したので、これらのデータ ソースにいくつかのコントロールをバインドしてみましょう。まず、フォームに
DetailsView コントロールをドロップして、「dvActivity」という名前に変更します。このコントロールの
DataSourceID プロパティを odsActivity に設定し、DataKeyNames
プロパティを iActivityID に設定します。Fields コレクション
プロパティに移動して、iActivityID の Visible プロパティを False
に設定します。他のフィールドの HeaderText プロパティを適切な名前に変更します。
次に、コンテンツ ペインに GridView
コントロールをドロップし、「gvEnrollment」という名前に変更します。このコントロールの DataSourceID
プロパティを odsStudent に設定します。Columns コレクション
プロパティに移動して、iUserID の Visible プロパティを False
に設定します。残りの列の HeaderText プロパティを適切な名前に変更します。
フォームがブラウザで表示されると、管理者には、選択した履修科目の詳細を一覧した表と登録している学生を一覧した表が表示されます。
.jpg)
図 12. 履修科目の登録状況フォームのデザイン ビュー
配置
このアプリケーションの配置は非常に単純明快です。ASP.NET 2.0 ではアーキテクチャがプロジェクト ドリブンからフォルダ
ドリブンに変更されたという点において、以前のバージョンの ASP.NET
と一線を画しています。つまり、アプリケーションを配置するのに必要な作業は、ルート Web
フォルダを同じコンピュータ上の別の場所またはアプリケーションをダウンロードできる FTP
サイトにコピーするだけです。配置先サーバーは、いくつかの必要条件を満たしている必要があり、SQL Server 2005 Express
と、IIS または "Cassini" (Visual Web Developer Web サーバー) を実行している別バージョンの Visual
Web Developer 2005 Express Edition がインストールされている必要があります。また、現在リリースされている
Visual Web Developer 2005 Express Edition
の主な用途は開発環境なので、配置に関しては制限があります。現在リリースされているベータ版を使用して、配置済みの SQL
Server 2005 Express Edition
データベースをアタッチするには管理者特権が必要です。ただし、ベータ版以降のバージョンでは、ローカルの SQL Server 2005
Express データベース コンテンツを提供済みの SQL Server データベースに配置するためのサポートが強化される予定です。
現在リリースされているベータ版の配置に関する制限により、ここでは Web
フォルダを物理的に同じコンピュータの別の場所に移動するだけにとどめます。この移動で配置プロセスについて説明します。Web
フォルダを別の場所にコピーする前に、1 つ変更を加える必要があります。この時点では、データ接続は Data ディレクトリ内にある .MDF
データベースの物理パスを指しています。この接続文字列を相対パスに変更する必要があります。web.config
ファイルを開くと、プロバイダを設定したときに生成された接続文字が設定されていることを確認できます。接続文字列内には、次のような属性が設定されています。
Database=c:\WebSites\StudentActivities\Data\StudentActivities.mdf
このパスは、使用中のコンピュータの構成によって多少異なることがあります。これは、Data
フォルダ内のデータベースの物理パスを指しています。この属性を以下のように変更します。
AttachDbFileName=|DataDirectory|StudentActivities.mdf
AttachDbFileName は、ASP.NET 2.0
の特別な属性です。このフォルダを移動して配置すると、この属性により、ASP.NET 2.0 ではデータベースが SQL
Server 2005 Express のローカル インスタンスにアタッチされるようになります。また、データベースの完全修飾パスを
|DataDirectory|StudentActivities.mdf に変更しました。ASP.NET 2.0
では、この相対パス名は Web フォルダの Data ディレクトリにマップされるものとして認識されます。
理論的に、アプリケーションを配置する前に必要な変更作業は、これだけです。ただし、ここでは、データ コンポーネントの設定に使用した Data
Component Configuration Wizard のバグが原因で、データ コンポーネントを処理する接続文字列を web.config
ファイルに記述できませんでした。そのため、接続文字列をデータ
コンポーネント自体に保存する必要がありました。アプリケーションを配置するときには接続文字列を変更する必要があり、データ
コンポーネントに接続文字列を格納した場合はデータ コンポーネント内の接続文字列も変更する必要があるので、データ
コンポーネントに接続文字列を格納することは得策ではありません。接続文字列は web.config ファイルに格納し、データ
コンポーネントでは、このファイルに格納されている接続文字列を使用することをお勧めします。ただし、このアプリケーションでは、このバグが原因で、この方法を採用できませんでした
(このバグはベータ版がリリースされるまでには、おそらく修正されていると思います)。繰り返しになりますが、ここでは Activities
データ コンポーネントと StudentActivities データ
コンポーネントの両方で接続文字列を変更する必要があります。接続文字列を変更するには、ソリューション
エクスプローラで、Activities データ コンポーネントをダブルクリックします。データ
コンポーネントを開いたら、[Property] ウィンドウに移動して、DefaultConnection
プロパティを配置し、ConnectionString プロパティの値を web.config
ファイルのプロバイダ接続文字列と同様に変更します。StudentActivities データ
コンポーネントについても、同じ操作を行います。Visual Web Developer 2005 Express Edition の [Build]
メニューの [Build Web Site] をクリックして、Web サイトをビルドします。
これで、すべての接続文字列が相対パスを指すように変更されたので、この Web フォルダは完全に独立した Web フォルダになりました。
Web サイトを別の場所にコピーするには、Visual Web Developer 2005 Express Edition で
[Website] メニューの [Copy Web Site] をクリックします。この操作により、Web
フォルダの移動をサポートするウィンドウが表示されます。左上には、[Connect To] メニューが表示されます。このメニューの隣にある
[Connect to a remote site] ボタンをクリックします。この操作により、接続先のサイトを選択するダイアログ
ボックスが表示されます。このダイアログでは [File System]、[Local IIS]、[FTP sites]、または [Remote
sites] のいずれかを選択できます。ここでは [File System] を選択します。では、単純にコードを新しい Web
フォルダに配置してみましょう。既存の Web フォルダと同じルート
ディレクトリに、「StudentActivitiesDeployed」という新しいフォルダ名を入力して、[Open]
をクリックします。フォルダを作成するかどうかを確認するメッセージが表示されます。[Yes]
をクリックします。この操作により、新しいフォルダが設定されます。[Source Web Site] ボックスに Web
コンテンツが表示され、[Remote Web Site] ボックスには空のフォルダが 1 つ表示されます。作成した Web
ファイルをすべて選択して、右矢印のボタンをクリックします。この操作により、配置先の Web フォルダにすべてのファイルがコピーされます。
.jpg)
図 13. Copy Web Site Wizard
まとめ
この 3 部構成の資料では、セキュリティで保護されたデータ ドリブンの Web
アプリケーションを最初からビルドしました。この一連の資料では、ASP.NET 2.0 で、単純明快な管理ツールと SQL
Server 2005 Express のセキュリティ関連のテーブルのライブラリとストアド
プロシージャ、および一連の統合されたセキュリティ サーバー
コントロールを組み合わせて使用して、セキュリティを設定する作業が大幅に簡略化されたことをご覧に入れました。
まず、フロントエンドからデータベースへのデータの流れを最適化および管理するデータ
コンポーネントで構成されているビジネス層を考案するのが、どれほど簡単であるのかについて説明しました。次に、データ ソースを導入すると、サーバー
コントロールを基になっているデータ構造にバインドすることが、どれほど簡単であるのかということについても説明しました。
最後に、ASP.NET 2.0 がテンプレート ドリブンな Web アーキテクチャ、サイト ナビゲーション、データ
バインド、および配置にもたらした進歩についても説明しました。
Visual Web Developer と SQL Server Express
は、併用すると優れた機能を発揮します。配置の容易さと必要なコード量の大幅な減少は、ASP.NET 開発者が、ASP.NET 2.0
によりもたらされた進歩の調査に乗り出す十分な動機付けとなることでしょう。
Dan Burman
は、ニューヨークを拠点とするカスタム ソフトウェア会社 Citigate Hudson のコンサルタントです。Citigate Hudson
は、Microsoft Gold Certified Partner for Business Intelligence です。Citigate Hudson.gif)
の Web
サイトを参照してください。