web-dev-qa-db-ja.com

MVC4の部分ビューにスクリプトを追加する方法は?

これは私の部分的なビューにあるコードです

@model Contoso.MvcApplication.Models.Exercises.AbsoluteArithmetic

@using(Html.BeginForm())
{
<div>
    <span style="width: 110px; float:left; text-align:center; font-size:2.5em;">@Model.Number1</span>
    <span style="width: 110px; float:left; text-align:center; font-size:2.5em;">+</span>
    <span style="width: 110px; float:left; text-align:center; font-size:2.5em;">@Model.Number2</span>
    <span style="width: 110px; float:left; text-align:center; font-size:2.5em;">=</span>
    <span>
            @Html.EditorFor(model => model.Result)
            @Html.ValidationMessageFor(model => model.Result)
    </span>
</div>
}

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

コードの下部にある@section、ブレークポイントを設定すると実行されないことに気付きました。 _Layout.cshtmlでその行を移動するとうまくいきますが、それは考えではありません。

部分的なカミソリビューでそのライブラリを追加することをMVC4に伝えるにはどうすればよいですか?

37
Darf Zon

.jsファイルには@Scripts.Render("~/Scripts/my-script.js")を、cssファイルには@Styles.Render("~/Content/my-Stylesheet.css")を使用できます。

注:特定のバンドルでも機能します詳細-' http://www.asp.net/mvc/overview/performance/bundling-and-minification '

部分ビューを含むカミソリのすべてのサブページで機能します。これらのヘルパーの使用法についての詳細情報グーグル

13
Nishanth Shaan

パーシャルからレイアウトセクションをレンダリングすることはできません。セクション定義を親ページまたはレイアウトに移動します。

8
viperguynaz

私の答えを確認してください 部分ビューでセクションをレンダリングする方法 。これにより、任意のビュー/部分ビューでスクリプトとスタイルを定義できます。また、重複するインクルードも処理します。

私の個人的な見解は、セクションはスタイルとjavascriptincludesに適したソリューションではないということです。

5
Erik Philips

この問題の一般的な解決策はありませんが、次の最も簡単な方法を実行できます。

1)次のように一連の拡張メソッドを作成できます。

https://stackoverflow.com/a/6671766/5208058

2)JavaScriptコードを分離した部分ビューに移動し、メインビューで2つの部分ビューをレンダリングします。 1つはメインの部分ビュー用で、もう1つは次のスクリプト用です。

{
    // markup and razor code for Main View here

    @Html.Partial("Main_PartialView")
}

@section Scripts
{
    @Html.Partial("JavaScript_PartialView")
}

それが役に立てば幸い。

4
Varan Sinayee

スクリプトセクションなしで、部分ビューhtmlの最後にスクリプトを直接追加できます(スクリプトセクションは部分ビューでレンダリングされないため)

<script language="javascript">
   // Your scripts here
   // ....
</script>
4
Pila 77

これは私にとってはうまくいき、JavaScriptとHTMLを同じファイルで部分的に表示できるように配置し、読みやすくしました。

_ MyPartialView.cshtml」と呼ばれる部分ビューを使用するビューで

<div>
    @Html.Partial("_MyPartialView",< model for partial view>,
            new ViewDataDictionary { { "Region", "HTMLSection" } } })
</div>

@section scripts{

    @Html.Partial("_MyPartialView",<model for partial view>, 
                  new ViewDataDictionary { { "Region", "ScriptSection" } })

 }

パーシャルビューファイル

@model SomeType

@{
    var region = ViewData["Region"] as string;
}

@if (region == "HTMLSection")
{


}

@if (region == "ScriptSection")
{
        <script type="text/javascript">
    </script">
}
2
purvin

このStackoverflowページは、この質問に対する完全なソリューションを提供しました: エディター/表示テンプレートのセクションの使用

TL; DR:Forloop.HtmlHelpers nugetパッケージ https://www.nuget.org/packages/Forloop.HtmlHelpers/ をプロジェクトに追加するだけですASP.NET MVCのRazor部分ビューおよびテンプレートからJavascriptを実行できます。私はこれをMVC 5プロジェクトで個人的に使用しました。

0
James Porter

一部のビューにのみ特定のスクリプトを含め、アプリケーション全体に不必要にスクリプトを広めたくない場合は、次のようにすることができます。

BundleConfig.csで空のjavascriptファイルを指すバンドルを定義します。

 bundles.Add(new ScriptBundle("~/bundles/empty").Include(
                    "~/Scripts/empty.js"
            ));

_Layout.cshtmlのheadセクションで、次の変数を追加します。

@{
        ViewBag.AdditionalBundle = String.IsNullOrEmpty(ViewBag.AdditionalBundle) ? "~/bundles/empty" : ViewBag.AdditionalBundle;
    }

_Layout.cshtmlの下部で、必要な追加のバンドルをレンダリングします。

@Scripts.Render("~/bundles/lib")
    @Scripts.Render(@ViewBag.AdditionalBundle);
    @RenderSection("scripts", required: false)

最後に、特定のスクリプトが必要な部分ビューで、対応するバンドルを変数に追加するだけです。

ViewBag.AdditionalBundle = "~/bundles/mySpecificBundle";

部分ビューは_Layout.cshtmlの前にレンダリングされるため、ファイルの上部でその確認が必要です。これは次のようになります:部分ビューがViewBag.AdditionalBundleに値を割り当てた場合、それを使用します。それ以外の場合は、空のスクリプトをレンダリングします。

0
Glauber