current community

your communities

more stack exchange communities

Stack Exchange
tour help
stack overflow careers
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 22 down vote favorite
6

I would like to be able to provide a way for partial views to include JavaScript code / files at the bottom of a view. This would enable partial views to include any JavaScript files that they depend on. For instance, if I wanted to write a partial that needs to create a JQueryUI dialog, I would like to import the JQueryUI JavaScript file as well as add JavaScript code that renders the dialog.

I'm currently writing this code in the parent view, which makes it kind of pointless to use a partial view.

I understand that calling RenderPartial multiple times would result in scripts being included multiple times. This is a solvable issue once I know how to actually include JavaScript into the main view from the partial view.

share|improve this question

2 Answers 2

up vote 7 down vote

Define ContentPlaceHolder in your MasterPage (ASPX) or Section in your Layout Page (Razor)

ASPX:

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

Razor:

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

Then in the Partial:

ASPX:

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

Razor:

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

Also think about using a HTML Helper to render out the <script> tags.

share|improve this answer
11  
I wasn't able to get this working with Razor. That's what I've been doing in my views. However, it doesn't look like partials inherit the layout from their parent view. If you try to set it explicitly in your partial views using your example, then you end up getting extra body tags where your partial views are rendered. –  Jonathan Matheus Jan 18 '11 at 5:33
    
"However, it doesn't look like partials inherit the layout from their parent view." - are you sure? Can you provide your partial view - it should have the layout definition at the top. –  RPM1984 Jan 18 '11 at 8:49
    
Any answer that works for Razor? If you include the layout in the partial, the layout elements get duplicated. If you don't include them, the section in the partial gets ignored. –  qes Apr 1 '11 at 20:00
1  
I found this link via ScottGu's blog. In the comments he explains why partial views can't use @section: "... a RenderPartial call ends up executing a brand new Razor page." It's a shame; I wanted to use jQuery-UI's Accordion, with each accordion section being its own partial page. Unfortunately I also wanted to include <script> blocks, which breaks the jQuery accordion logic... –  David Pope May 1 '11 at 23:02
4  
This will not work with razor section and partial views. –  Mortalus Mar 25 '13 at 11:28
up vote 0 down vote

You can include <script> tags inside the <body> tag so you can have them inside your partial view.

share|improve this answer
13  
having script tags in the middle of divs and tables is considered a bad practice and can lead to page load performance issues. I want the ability to add the scripts in the head section or at the bottom of the page. –  Jonathan Matheus Jan 18 '11 at 5:35
1  
This also does not address the particular problem being asked about in this question. Following best practices, the typical MVC layout and view structure results in script includes being rendered at the bottom of the page. Therefore, using jQuery syntax, for example, in a script in a partial view results in a JS syntax error. –  Sean Apr 12 '13 at 0:05

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.