25

MVC3プロジェクトには、このコードを含む「_Layout.vbhtml」ファイルがあります

<!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
    ...
    <script src="@Url.Content("~/Scripts/jquery-1.8.2.min.js")"></script>
    @RenderSection("Scripts", false)
  </body>
</html>

次に、共有フォルダーに部分ビュー「ValidationScripts.vbhtml」があります。

@Section Scripts
    <script src="@Url.Content("~/Scripts/jquery.validate.min.js")"></script>
    <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")"></script>
    <script src="@Url.Content("~/Scripts/jquery.validate.fix.js")"></script>  
    <script src="@Url.Content("~/Scripts/localization/messages_de.js")"></script>      
End Section

このようなビューから部分ビューを呼び出すと...

@ModelType MvcExample.MyModel
@Code
    ViewData("Title") = "Test"
End Code

@Html.Partial("ValidationScripts")

<h2>Just a Test</h2>
...

セクション「スクリプト」はページにレンダリングされず、出力HTMLは次のようになります。

<!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
    ...
    <script src="@Url.Content("~/Scripts/jquery-1.8.2.min.js")"></script>

  </body>
</html>

部分ビューでセクションをレンダリングするにはどうすればよいですか?

4

5 に答える 5

46

重複するスクリプトに加えて同じ問題が発生したため、いくつかの拡張メソッドを作成しました。

public static class HtmlHelperExtensions
{
  private const string _jSViewDataName = "RenderJavaScript";
  private const string _styleViewDataName = "RenderStyle";

  public static void AddJavaScript(this HtmlHelper htmlHelper, 
                                   string scriptURL)
  {
    List<string> scriptList = htmlHelper.ViewContext.HttpContext
      .Items[HtmlHelperExtensions._jSViewDataName] as List<string>;
    if (scriptList != null)
    {
      if (!scriptList.Contains(scriptURL))
      {
        scriptList.Add(scriptURL);
      }
    }
    else
    {
      scriptList = new List<string>();
      scriptList.Add(scriptURL);
      htmlHelper.ViewContext.HttpContext
        .Items.Add(HtmlHelperExtensions._jSViewDataName, scriptList);
    }
  }

  public static MvcHtmlString RenderJavaScripts(this HtmlHelper HtmlHelper)
  {
    StringBuilder result = new StringBuilder();

    List<string> scriptList = HtmlHelper.ViewContext.HttpContext
      .Items[HtmlHelperExtensions._jSViewDataName] as List<string>;
    if (scriptList != null)
    {
      foreach (string script in scriptList)
      {
        result.AppendLine(string.Format(
          "<script type=\"text/javascript\" src=\"{0}\"></script>", 
          script));
      }
    }

    return MvcHtmlString.Create(result.ToString());
  }

  public static void AddStyle(this HtmlHelper htmlHelper, string styleURL)
  {
    List<string> styleList = htmlHelper.ViewContext.HttpContext
      .Items[HtmlHelperExtensions._styleViewDataName] as List<string>;

   if (styleList != null)
   {
     if (!styleList.Contains(styleURL))
     {
       styleList.Add(styleURL);
     }
   }
   else
   {
     styleList = new List<string>();
     styleList.Add(styleURL);
     htmlHelper.ViewContext.HttpContext
       .Items.Add(HtmlHelperExtensions._styleViewDataName, styleList);
   }
 }

 public static MvcHtmlString RenderStyles(this HtmlHelper htmlHelper)
 {
   StringBuilder result = new StringBuilder();

   List<string> styleList = htmlHelper.ViewContext.HttpContext
     .Items[HtmlHelperExtensions._styleViewDataName] as List<string>;

   if (styleList != null)
   {
     foreach (string script in styleList)
     {
       result.AppendLine(string.Format(
         "<link href=\"{0}\" rel=\"stylesheet\" type=\"text/css\" />", 
         script));
     }
   }

  return MvcHtmlString.Create(result.ToString());
  }
}

ビューまたは部分ビューまたは表示/編集テンプレートでは、必要なものを追加するだけです。

@{
  Html.AddJavaScript("http://cdn.jquerytools.org/1.2.7/full/jquery.tools.min.js");
}

レイアウトで、必要な場所にレンダリングします。

<!DOCTYPE html>
<html lang="en">
  <head>
  @Html.RenderStyles()
  @Html.RenderJavascripts()

唯一の問題は、複雑になった場合にスクリプトがレンダリングされる順序です。それが問題になる場合は、ビュー/テンプレートの下部にスクリプトを追加し、レンダリングする前に拡張メソッドの順序を逆にするだけです。

于 2012-12-07T14:59:22.147 に答える
6

部分ビューでセクションを使用することはできません。ここに記載されているように、カスタムヘルパーを利用できます。

于 2012-12-07T14:57:36.537 に答える
2

このhttp://weblogs.asp.net/scottgu/archive/2011/05/12/asp-net-mvc-3-and-the-helper-syntax-within-razor.aspxにヘルパーを使用する必要があると思います

MVC4にアップグレードできる場合は、新しいバンドルおよびミニファイ機能を使用できます:http ://www.asp.net/mvc/tutorials/mvc-4/bundling-and-minification 。これは、達成しようとしていること(スクリプトを含む)に対処するように特別に設計されています。

または、MVC3でhttp://combres.codeplex.com/を使用することもできます

于 2012-12-07T14:25:31.730 に答える
1

私が正しく理解していれば、あなたは構造を持っています

  • Layout.cshtml
  • ビュー-X
    • PartialView Y(View-X内で呼び出されます)

次に、を定義する必要があります

@section Script{ .... }View -Xはに 設定されているため、部分ビューYではなくView -XでView.LayoutLayout.cshtml

于 2012-12-07T14:35:12.193 に答える
-3

これはすべて素晴らしい情報でしたが、彼の元のコードを見ると、セクションは大文字になっているため、認識されません。

それは何とかすべきではあり@sectionません@Section

于 2015-04-03T17:39:58.740 に答える