ASP.NET MVC コントロールヘルプ
クイックスタート
コントロールの使用 > Input > Menu > クイックスタート

このトピックでは、アプリケーションに Menu コントロールを追加する方法を示します。ComponentOne ASP.NET MVC コントロールを追加する方法については、「コントロールの追加」を参照してください。

このトピックは4つの手順で構成されます。

次の図は、上記の手順を実行した後の Menu を示しています。

手順 1:MVC アプリケーションの作成

ComponentOneまたはVisualStudioテンプレートを使用して新しいMVCアプリケーションを作成します。MVCアプリケーションの作成の詳細については、「MVCアプリケーションの設定」を参照してください。

手順 2:新しいコントローラーおよびビューの追加

新しいコントローラーの追加

  1. ソリューションエクスプローラーで、[コントローラー]フォルダを右クリックします。
  2. コンテキストメニューから、[追加]→[コントローラー]を選択します。[コントローラーの追加]ダイアログが表示されます。
  3. [コントローラーの追加] ダイアログで、次の手順を実行します。
    1. コントローラーの名前を設定します(例:Default1Controller)。
    2. [MVC 5 コントローラー -空]テンプレートを選択します。
    3. [追加]をクリックします。
  4. アプリケーションに新しいコントローラーが追加されます。

ビューの追加

  1. ソリューションエクスプローラーで、[コントローラー]フォルダを展開し、コントローラー(例:Default1Controller)をダブルクリックして開きます。
  2. メソッド Index() 内にカーソルを置きます。
  3. 右クリックし、[ビューの追加]を選択します。[ビューの追加]ダイアログが表示されます。
  4. [ビューの追加]ダイアログで、ビュー名が Index で、ビューエンジンが Razor(CSHTML)であることを確認します。
  5. [追加]をクリックします。コントローラーにビューが追加されます。

手順 3:コントロールの追加

  1. ソリューションエクスプローラーで、[ビュー]フォルダを展開します。
  2. Index.cshtml をダブルクリックして開きます。
  3. Index.cshtml ファイルのデフォルトのコードを次のコードに置き換えて、Menu コントロールを初期化します。
    C#
    コードのコピー
    <div>
        @(Html.C1().Menu().Header("File")
            .Width(300)
            .MenuItems(items => items
                .Add(item => item.Header("New"))
                .Add(item => item.Header("Open"))
                .Add(item => item.Header("Save"))
                .Add(item => item.IsSeparator(true))
                .Add(item => item.Header("Exit"))
            )
        )
    </div>
    

手順 4:プロジェクトのビルドおよび実行

  1. [ビルド]→[ソリューションのビルド]をクリックして、プロジェクトをビルドします。
  2. [F5] キーを押してプロジェクトを実行します。
    ブラウザのアドレスバーで、生成された URL にフォルダ名とビュー名を追加して(例:http://localhost:1234/Default1/index)、ビューを表示します。または、ビューをホームページにリンクします。

先頭に戻る