web-dev-qa-db-ja.com

ASP.NET MVC3でパーシャルビューからJavaScriptを含める方法

ビューの下部にJavaScriptコード/ファイルを部分ビューに含める方法を提供できるようにしたいと思います。これにより、部分ビューに、依存するJavaScriptファイルを含めることができます。たとえば、JQueryUIダイアログを作成する必要のあるパーシャルを記述したい場合は、JQueryUI JavaScriptファイルをインポートし、ダイアログをレンダリングするJavaScriptコードを追加します。

現在、このコードを親ビューで作成しているため、部分ビューを使用しても意味がありません。

RenderPartialを複数回呼び出すと、スクリプトが複数回含まれることになることを理解しています。 JavaScriptを部分ビューからメインビューに実際に組み込む方法を知ったら、これは解決可能な問題です。

javascriptasp.net-mvcasp.net-mvc-3partial-viewsrenderpartial
29
Jonathan Matheus

MasterPage（ASPX）でContentPlaceHolderを定義するか、レイアウトページ（Razor）でSectionを定義します

[〜＃〜] aspx [〜＃〜]：

<body>
  <!-- End of Body -->
  <asp:ContentPlaceHolder ID="JavaScriptIncludes" runat="server" />
</body>

カミソリ：

<body>
  <!-- End of Body -->
   @RenderSection("JavaScriptIncludes", required: false)
</body>

次に、部分的に：

[〜＃〜] aspx [〜＃〜]：

<asp:Content ID="ExtraJs" ContentPlaceHolderID="JavaScriptIncludes" runat="server">
   <script type="text/javascript" src="@Url.Content("/Scripts/SomeScript.js")" />
</asp:Content>

カミソリ：

@section JavaScriptIncludes
{
   <script type="text/javascript" src="@Url.Content("/Scripts/SomeScript.js")" />
}

また、HTMLヘルパーを使用して<script>タグをレンダリングすることも検討してください。

7
RPM1984

これは、任意のライブラリを使用するJavaScriptコードを含むパーシャルビューを作成する方法です（ライブラリがページの最後にロードされている場合でも）

部分ビューに追加：

@{
    TempData["Script"] += "MyFunction();";
}

<script type="text/javascript">
    function MyFunction() {
        // you can call your library here, e.g. jquery:
        $(function () {

        });
    }
</script>

_ Layout.cshtmlページで、ライブラリが含まれた後に追加します。

@*LOAD YOUR LIBRARIES HERE (E.G. JQUERY) *@


@if (TempData["Script"] != null)
{
    <script type="text/javascript">
        @Html.Raw(TempData["Script"].ToString())
    </script>
}

それらの関数を同じキーTempData ["Script"]にアタッチする複数の部分ビューを持つことができます。 + =演算子を使用して関数を追加し続けると、それらは共存します。

@{
    TempData["Script"] += "AnotherFunction();";
}
1
VeganHunter

<script>タグ内に<body>タグを含めて、部分ビュー内に含めることができます。

0
Vadim