admin管理员组

文章数量:1312866

My code piles and runs without errors; however, it doesn't render as I expected.

The Theory:

I want to use multiple layout pages.

The "base" layout should only include the style and javascript files that are being used by the solution.

The other layout should have the html content or wrappers. This layout seems superfluous currently, but my superior assures me it will lead to future greatness. Such as having multiple headers or the ability to not have headers or footers on certain pages. The main things is to have multiple ContentLayouts but one mon BaseLayout

The Code:

_BaseLayout

<html>
   <head>
       <link href="@Url.Content("~/Content/css/main.css")" rel="stylesheet" type="text/css" />
       <script type="text/javascript" src="@Url.Content("~/Scripts/mon.js")"></script>
       @RenderSection("JavaScript", false)
       @RenderSection("Css", false)
   </head>
   <body>
       @RenderBody()
   </body>
</html>

_ContentLayout

 @{
    Layout = "~/Views/Shared/_BaseLayout.cshtml";
 }

 @RenderSection("JavaScript", false)
 @RenderSection("Css", false)

 <div class="page">
     <section class="wrapper">
       @RenderBody()
     </section>
 </div>

View.cshtml

 @{
     Layout = "~/Views/Shared/_ContentLayout.cshtml";
 }

 @section JavaScript
 {
      <script type="text/javascript">
    (function ($) {
        $(function () {
            //do stuff;
        });
    } (jQuery));
</script>
 }

 <div>
      //html content
 </div>

Like I stated earlier this works. The problem is when I view the page source the script from the view is rendered in the _ContentLayout and thus falls outside of the designated script area. Can I "kick" the script code to the next layout? This would allow all the script code to be in the same area.

My code piles and runs without errors; however, it doesn't render as I expected.

The Theory:

I want to use multiple layout pages.

The "base" layout should only include the style and javascript files that are being used by the solution.

The other layout should have the html content or wrappers. This layout seems superfluous currently, but my superior assures me it will lead to future greatness. Such as having multiple headers or the ability to not have headers or footers on certain pages. The main things is to have multiple ContentLayouts but one mon BaseLayout

The Code:

_BaseLayout

<html>
   <head>
       <link href="@Url.Content("~/Content/css/main.css")" rel="stylesheet" type="text/css" />
       <script type="text/javascript" src="@Url.Content("~/Scripts/mon.js")"></script>
       @RenderSection("JavaScript", false)
       @RenderSection("Css", false)
   </head>
   <body>
       @RenderBody()
   </body>
</html>

_ContentLayout

 @{
    Layout = "~/Views/Shared/_BaseLayout.cshtml";
 }

 @RenderSection("JavaScript", false)
 @RenderSection("Css", false)

 <div class="page">
     <section class="wrapper">
       @RenderBody()
     </section>
 </div>

View.cshtml

 @{
     Layout = "~/Views/Shared/_ContentLayout.cshtml";
 }

 @section JavaScript
 {
      <script type="text/javascript">
    (function ($) {
        $(function () {
            //do stuff;
        });
    } (jQuery));
</script>
 }

 <div>
      //html content
 </div>

Like I stated earlier this works. The problem is when I view the page source the script from the view is rendered in the _ContentLayout and thus falls outside of the designated script area. Can I "kick" the script code to the next layout? This would allow all the script code to be in the same area.

  • javascript
  • asp-mvc-3
  • html
  • razor
Share Improve this question edited Jun 27, 2012 at 11:22 Tohid 6,6998 gold badges58 silver badges81 bronze badges asked Jun 26, 2012 at 23:23 dan_vitchdan_vitch 4,55912 gold badges48 silver badges69 bronze badges
Add a ment  | 

1 Answer 1

Reset to default 6

You should develop views in respect to @RenderSection() behavior.

Each @RenderSection() renders its descendant @section SectionName { }. So you need to change your Views in this order:

_BaseLayout.cshtml - Remains as it is.

_ContentLayout.cshtml:

@{Layout = "~/Views/Shared/_BaseLayout.cshtml";}

@section JavaScript {
    @RenderSection("JavaScriptToHead", false)
}

@section Css {
    @RenderSection("CssToHead", false)
}

<div class="page">
    <section class="wrapper">
        @RenderBody()
    </section>

and finally View.cshtml:

@{Layout = "~/Views/Shared/_ContentLayout.cshtml";}

@section JavaScriptToHead {
    //JS stuff
}

@section CssToHead {
   //Css stuff
}

<div>
    //html content
</div>

本文标签： aspnet mvc 3Render all Javascript code in one section using nested layoutsStack Overflow

版权声明：本文标题：asp.net mvc 3 - Render all Javascript code in one section using nested layouts - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1741869183a2402091.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。