CODEWITHSUNDEEP
c#asp.net-mvcasp.net-mvc-4razor
1110
1110

Reputation: 6829

Why jquery doesn't work on a page defined in layout

I have a razor layout and it loads css jquery etc.
When I add controller action view I set layout to be _Layout.cshtml
But jquery doesn't work in that page.
So I have to add @Scripts.Render("~/bundles/jquery") in each view.
Why imported jquery is not inherited from _Layout.cshtml? Is it normal?

Upvotes: 6

Views: 6107

Answers (1)

Robert McKee
Robert McKee

Reputation: 21477

This should be near the bottom of _Layout.cshtml:

@Scripts.Render("~/bundles/jquery")
@RenderSection("scripts", required: false)

This should be in your child view:

@section scripts {
    @Scripts.Render("~/scripts/jquery.infinitescroll.js") // Or some other script
}

All your scripts (that reference jquery) in your child views need to be in the scripts section, not placed in the body of the page. That includes any script tags that want to make use of jquery as well. For example, one of my pages has the following:

@section scripts {
    @Scripts.Render("https://maps.googleapis.com/maps/api/js?key=&sensor=false")
    <script src="~/scripts/google-maps-3-vs-1-0.js"></script>
    <script>
        Stuff here
    </script>
}

Upvotes: 9

Related Questions