How to render Views or Partial Views of scripts at the bottom in _Layout.cshtml?

Question

I have a problem in rendering few of my partial view’s script tags should render at the bottom in _Layout.cshtml page.

Scripts should not be in partial views. – Apr 06 '16 at 12:19 — , Apr 06 '16 at 12:19
What Helper do you use? – Jean-Claude Colette Apr 06 '16 at 12:28 — Jean-Claude Colette, Apr 06 '16 at 12:28
I am using `@Scripts.Render("path of the file")` – sridharnetha Apr 06 '16 at 12:34 — sridharnetha, Apr 06 '16 at 12:34

sridharnetha · Answer 1 · 2016-04-07T07:27:51.730

I got solution,You may not want to render everything on every page. Sectioning gives you control of that.

In _Layout .cshtml define scripts tags like this,

<script src="/scripts/libs/jquery-ui-1.10.3.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>
@if (IsSectionDefined("bottomScripts"))
{
    @RenderSection("bottomScripts", required: false) 
}

In YourView.cshtml define a section like this

@section bottomScripts{
<script src="~/Scripts/jquery.unobtrusive-ajax.min.js"></script>
}

Here is a standard structure of Layout and Views in MVC.

_Layout.cshtml

<!DOCTYPE html>

<html lang="en-us">
<head>
    <meta charset=" utf-8">
    <title>@ViewBag.Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">

    <link rel="stylesheet" href="~/content/css/stye1.css" />
    <link rel="stylesheet" href="~/content/css/style2.css" />
    @if (IsSectionDefined("myStyles"))
    { 
       @RenderSection("myStyles", required: false);
    }
</head>
<body>
<header>
    <a href="/Index">
        <h1>My Website<small>Your Slogan</small></h1>
    </a>
</header>
<div>
    @RenderBody()
</div>
<script src="~/Scripts/script1.js"></script>
<script src="~/Scripts/script2.js"></script>
@if (IsSectionDefined("myScripts"))
{
    @RenderSection("myScripts", required: false);
}
</body>
</html>

View1.cshtml

<div>This is View1</div>
@section myStyles{
<link rel="stylesheet" href="~/Pagespecificstyle.css" />
}
@section myScripts{
<script src="~/PageSpecificScript.js"></script>
}

View2.cshtml

<div>This is View2</div>
@section myStyles{
<link rel="stylesheet" href="~/Pagespecificstyle2.css" />
}
@section myScripts{
<script src="~/PageSpecificScript2.js"></script>
}

How to render Views or Partial Views of scripts at the bottom in _Layout.cshtml?

1 Answers1