ASP.NET MVCプロジェクトの作成
まず、Visual Studioを開き、新しいASP.NET MVC 3アプリケーションを作成します。プロジェクト名は"InfraShoppingMall"とします。プロジェクトテンプレートではインターネットアプリケーションを選択し、ビューエンジンはRazorを選択します。詳細については「ASP.NET MVC 3Tools UpdateとView周りの改良点」を参考にしてください。
プロジェクトに必要なファイルを追加
作成されたプロジェクトのScript、ContentフォルダーにそれぞれIGという名前のフォルダーを作成し、次のファイルをNetAdvantage for jQueryのインストールフォルダーからコピーします。
-
Content/IGフォルダー
- themes\minフォルダー内のフォルダー、ファイル
-
Scripsts/IGフォルダー
- ig.ui.min.js
ここまでのフォルダー構造は次のようになっています。
図2 必要ファイルの組み込み
次に、追加したこれらのCSS, スクリプトファイルを画面側で参照する必要があります。Sharedフォルダーの_Layout.cshtmlファイルで参照するとすべてのビューに反映されます。
_Layout.cshtml
<script src="@Url.Content("~/Scripts/jquery-ui-1.8.11.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/IG/ig.ui.min.js")" type="text/javascript"></script>
<link href="@Url.Content("~/Content/IG/base/ig.ui.grid.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/IG/ig/jquery.ui.custom.min.css")" rel="stylesheet" type="text/css" />
さらに、ASP.NET MVC 3用に用意されているラッパークラスアセンブリInfragistics.Web.MVC.dllへの参照を追加し、ビュー編集画面においてラッパーを利用するためにアセンブリのプロパティ画面でローカルコピーをTrueと設定します。
図3 MVCラッパーへのアセンブリ参照
図4 Trueと設定することでBinフォルダーにアセンブリがコピーされる
