| MVC Classic ユーザーガイド > はじめに > MVC 5 での Wijmo の操作 |
MVC ツールを使用する場合、次の２つのアプリケーションを選択できます。 標準の Visual Studio ASP.NET MVC 5 Web アプリケーションを使用するか、当社の Wijmo 向けに最適化された ASP.NET MVC 5 Wijmo インターネットアプリケーションを使用することができます。 ASP.NET MVC 5 Wijmo インターネットアプリケーション（「MVC Classic プロジェクトの作成」を参照）は、そのデフォルトの UI に Wijmo コントロールを使用し、必要な Wijmo アセンブリはアプリケーションの _Layout.cshtml ページで参照済みです。Wijmo ウィジェットは、常に Views フォルダにある１つまたは複数のビュー（.cshtml ファイル）の下に追加されます。 MVC 5 ビューに関するいくつかの基礎を復習しておくと便利です。
ビューがユーザーに表示される前に、コントローラーでビューの return View() ステートメントが実行されます。 そのビューのレイアウト、実際にはプロジェクトにあるすべてのビューのレイアウトは _ViewStart.cshtml で指定されています。 _ViewStart.cshtml ファイルは Views フォルダのルートにあります。_ViewStart.cshtml ファイルを開くと、次の Razor 構文があるのがわかります。
| ソースビュー |
コードのコピー
|
|---|---|
@{
Layout = "~/Views/Shared/_Layout.cshtml";
}
|
|
プロジェクト全体のレイアウトの一部として Wijmo ウィジェットを表示する場合は、このページにウィジェットの HTML 要素を追加し、それを初期化することができます。 実際、ASP.NET MVC 5 Wijmo インターネットアプリケーションでは、いくつかのウィジェットがその _Layout.cshtml ファイルですでにレイアウトされています。
特定のビューにウィジェットを表示する場合は、そのビューを開き、そのページにウィジェットの HTML 要素を追加し、jQuery を使用してそれを初期化します。 たとえば、最初のページにメニューを表示する場合は、次のマークアップとスクリプトを _Index.cshtml ファイルに追加するだけです。
| ソースビュー |
コードのコピー
|
|---|---|
<body>
<header>
<div class="content-wrapper">
<div class="float-left">
<p class="site-title">@Html.ActionLink("MVC アプリケーション", "Index", "Home")</p>
</div>
<div class="float-right">
<nav>
<ul id="menu">
<li>Hello</li>
<li>World</li>
</ul>
<script type="text/javascript">
$(document).ready(function () {
$("#menu").wijmenu();
});
</script>
</nav>
</div>
</div>
</header>
</body>
|
|
このように簡単に行えます.