AFAIK, @section Scripts
doesn't work for partial views. There are two workarounds besides standard <script>
tag approach:
- Move the
@section Scripts
into a view page that contains the partial view, and place @RenderSection
on a layout page, e.g.:
_Layout.cshtml
@RenderSection("Scripts", required: false)
View.cshtml
@section Scripts
{
<script>
jQuery.cachedScript('@Url.StaticContent("myscript.js", false)');
</script>
}
Use a custom HTML helper extension for your partial view with this code (credits to Erik Philips on How to render a Section in a Partial View in MVC3?, using TagBuilder
instead of String.Format
for tag rendering):
public static class RenderJavaScript
{
private const String jsViewData = "RenderJS";
public static void IncludeJS(this HtmlHelper helper, String content)
{
List<String> contentList = helper.ViewContext.HttpContext.Items[RenderJavaScript.jsViewData] as List<String>();
if (contentList != null && contentList.Count > 0)
{
if (!contentList.Contains(url))
{
contentList.Add(url);
}
}
else
{
contentList = new List<String>();
contentList.Add(url);
helper.ViewContext.HttpContext.Items.Add(RenderJavaScript.jsViewData, contentList);
}
}
public static MvcHtmlString RenderJS(this HtmlHelper helper)
{
var result = new StringBuilder();
List<String> scriptList = helper.ViewContext.HttpContext.Items[RenderJavaScript.jsViewData] as List<String>();
if (scriptList != null && scriptList.Count > 0)
{
foreach (String script in scriptList)
{
// start <script> tag
TagBuilder startScript = new TagBuilder("script");
startScript.MergeAttribute("type", "text/javascript"); // optional
startScript.MergeAttribute("src", script); // required src attribute
result.AppendLine(startScript.ToString(TagRenderMode.StartTag));
// end </script> tag
TagBuilder endScript = new TagBuilder("script");
result.Append(endScript.ToString(TagRenderMode.EndTag));
}
}
return MvcHtmlString.Create(result.ToString());
}
// rendering inner text instead of using src attribute
public static MvcHtmlString CustomJS(this HtmlHelper helper)
{
var result = new StringBuilder();
List<String> contentList = helper.ViewContext.HttpContext.Items[RenderJavaScript.jsViewData] as List<String>();
if (contentList != null && contentList.Count > 0)
{
foreach (String text in contentList)
{
// start <script> tag
TagBuilder startScript = new TagBuilder("script");
startScript.MergeAttribute("type", "text/javascript"); // optional
startScript.SetInnerText(text);
result.AppendLine(startScript.ToString(TagRenderMode.StartTag));
// end </script> tag
TagBuilder endScript = new TagBuilder("script");
result.Append(endScript.ToString(TagRenderMode.EndTag));
}
}
return MvcHtmlString.Create(result.ToString());
}
}
To add scripts on views or partial views, add the IncludeJS
method either with script content:
@{
Html.IncludeJS(jQuery.cachedScript('@Url.StaticContent("myscript.js", false)'););
}
or using script path:
@{
Html.IncludeJS(@Url.StaticContent("myscript.js", false));
}
Then append either RenderJS
or 'CustomJS' method on Layout page:
@Html.RenderJS()
@Html.CustomJS()
Related problems:
How to add a script in a partial view in MVC4?
ASP MVC Define Section in Partial View