我在本节中定义了此部分 _Layout.cshtml
@RenderSection("Scripts", false)
我可以从视图中轻松使用它:
@section Scripts {
@*Stuff comes here*@
}
我正在努力的是如何从局部视图中获取本节内注入的一些内容.
我们假设这是我的视图页面:
@section Scripts {
<script>
//code comes here
</script>
}
<div>
poo bar poo
</div>
<div>
@Html.Partial("_myPartial")
</div>
我需要Scripts从_myPartial局部视图中注入部分内容.
我怎样才能做到这一点？
我尝试这样做的主要动机是获取Javascript,只需要页面底部的部分Javascript和其他Javascript,而不是在部分呈现的页面中间.
这是我正在尝试做的简化示例:
这是在正文之前的Scripts部分的布局.
<!DOCTYPE html>
<html>
<head>
<title>@ViewBag.Title</title>
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
</head>
<body>
@RenderBody()
<script src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript"></script>
@RenderSection("Scripts", false)
</body>
</html>
这是使用此布局的示例视图.
<h2>This is the view</h2>
@{Html.RenderPartial("_Partial");}
@section Scripts {
<script type="text/javascript">
alert("I'm a view.");
</script>
}
这是从视图中呈现的部分内容.
<p>This is the partial.</p>
@* this never makes it into the rendered page *@
@section Scripts {
<script type="text/javascript">
alert("I'm a partial.");
</script>
}
在此示例中,视图中指定的标记放在节中,但不包含部分标记.是否可以使用Razor从局部视图填充部分？如果没有,还有哪些其他方法可以获取Javascript,只需要页面底部的部分内容,而不是全局包含它？
这是我在局部视图中的代码
@model Contoso.MvcApplication.Models.Exercises.AbsoluteArithmetic
@using(Html.BeginForm())
{
<div>
<span style="width: 110px; float:left; text-align:center; font-size:2.5em;">@Model.Number1</span>
<span style="width: 110px; float:left; text-align:center; font-size:2.5em;">+</span>
<span style="width: 110px; float:left; text-align:center; font-size:2.5em;">@Model.Number2</span>
<span style="width: 110px; float:left; text-align:center; font-size:2.5em;">=</span>
<span>
@Html.EditorFor(model => model.Result)
@Html.ValidationMessageFor(model => model.Result)
</span>
</div>
}
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
}
请注意我的代码底部,我有一个@section,我意识到如果我在那里设置一个断点,它就不会运行.如果我在_Layout.cshtml中移动该行,则效果很好,但这不是主意.
如何在部分剃刀视图中告诉MVC4我想添加该库？
如何注入脚本标记,如
<script src="somejsfile"></script>
要么
<script type="text/javascript>some javascript</script>
从局部视图进入页面的head标签？
更新:旧问题的答案这是关于ASP.NET MVC.我们可以使用RenderSection.这里使用Razor视图引擎的MVC 3示例:
布局视图或母版页:
<html>
<head>
<script ...></script>
<link .../>
@RenderSection("head")
</head>
<body>
...
@RenderBody()
...
</body>
</html>
查看,例如主页:
@section head{
<!-- Here is what you can inject the header -->
<script ...></script>
@MyClass.GenerateMoreScript()
}
<!-- Here is your home html where the @RenderBody() located in the layout. -->
我在底部主布局中渲染了一个部分.这通常是在呈现时在页面底部呈现javascript的部分.在View和_partial视图中定义该部分.页面呈现时,它从页面视图呈现部分,但不从_partial视图呈现.
如何将_partial视图中定义的部分渲染为主布局？
此问题类似于ASP.NET MVC中部分视图中的Execute Javascript中描述的问题
index.cshtml中的下面一段代码工作得很好......
<label for="locationOfSearch"> in :</label> @Html.TextBox("locationOfSearch")
<input type="submit" value="Search" style="background-color:Green"/>
@section JavaScript {
<script type="text/javascript">
$(document).ready(function () {
$("#locationOfSearch").autocomplete({
source: '@Url.Action("AutocompleteAsyncLocations")'
})
});
</script>
}
但是,当我将上述代码和相应的脚本文件复制并粘贴到另一个视图,然后在index.cshtml中,如果我调用Html.Partial(新视图名称),则自动完成功能无效...
请告诉我如何解决它而不需要太多修改......
假设我在局部视图中有一个javascript幻灯片放映...
_Slideshow.cshtml:
@{
ViewBag.Title = "Slide Show";
}
<div id="slides">
</div>
<script src="js/slides.min.jquery.js"></script>
<script type="text/javascript">
$(function(){
$('#slides').slides({
// slide show configuration...
});
});
</script>
但我想成为一名优秀的小型Web开发人员,并确保我的所有脚本都位于页面底部.所以我会让我的*_Layout.cshtml*页面看起来像这样:
_Layout.cshtml:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>@ViewBag.Title</title>
<link href="@Url.Content("~/css/global.css")" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="wrapper">
@RenderBody
</div>
<!-- Being a good little web developer, I include my scripts at the BOTTOM, yay!
-->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script>
</body>
</html>
但是UH OH!我现在该怎么做,因为我的幻灯片脚本最终超出了我的jQuery包含范围？!如果我想在每个页面上播放幻灯片,这不会是什么大不了的事,但我只希望幻灯片放映部分视图在某个页面上呈现,并且......我希望我的脚本在底部!该怎么办？
我正在使用具有类似内容的Razor MVC的主布局
@RenderSection("scripts", required: false)
并有部分观点
_partial.cshtml
有这个
@section scripts
{
@Scripts.Render("~/bundles/jquery")
}
另一部分偏见
_partial_inside_partial.cshtml
那也有
@section scripts
{
<script>
$('div').addClass('red');
</script>
}
我有这个代码部分内部的问题,它在页面中间的负载,jquery是在底部？
我试图在ASP.Net MVC中创建一个可重用的小部件.这是一个将2个日期连接成字符串的小部件.该小部件包含3个文件:Widget.cshtml,Widget.css和Widget.js以及几个jquery库的依赖项.
Widget.cshtml
<h2>Create a date range</h2>
<div>
<label for="startDate">Start:</label>
<input id="startDate" class="date" name="startDate" type="text" />
</div>
<div>
<label for="endDate">End:</label>
<input id="endDate" class="date" name="endDate" type="text" />
</div>
<p id="output"></p>
<button id="createDateRange">Create</button>
Widget.css
label { color: #555;}
Widget.js
$(function () {
$(".date").datepicker();
$("#createDateRange").click(function () {
var start = $("#startDate").val();
var end = $("#endDate").val();
$("#output").html(start + " to " + end);
});
});
我想在我的MVC页面中重复使用这个小部件.我想出了几个选项,包括:
当我记得Steve Souders关于网站性能的规则时,我正准备使用帮助器:
规则5:将样式表放在顶部
规则6:将脚本放在底部
选项1),2)和3)看起来都是好主意,但它们都是内联编写代码并违反了性能规则.选项4)允许我手动将javascript和css文件放在它们所属的位置,但复制和粘贴容易出错.一个潜在的想法是写一个脚手架,把所有东西放在它所属的地方,但这似乎现在太多了.
什么是最好的(希望很简单)做小部件的方式,仍然遵循性能规则5和6？
我有一个可以与 Metro-UI 风格的图块配合使用的 Razor PartialView。这是一个非常简单的 PartialView，允许我显示绑定到 的图块ViewModel，实际上没什么了不起的。
由于并非所有页面都使用它，因此我不想在每个页面加载时都包含 jQuery 块。相反，我更喜欢将脚本声明为与 PartialView 内联，但在页面代码中注册一次。
视图如下（我重新设计了 Metrofy 模板）
@model IEnumerable<MetroStyleTile>
<div class="container tiles_hub">
<div class="sixteen columns alpha">
@foreach (MetroStyleTile tile in Model)
{
<div class="tile_item four columns alpha">
<a href="@Url.Action(tile.Action, tile.Controller, routeValues: tile.MvcArea != null ? new { area = tile.MvcArea } : null)" class="tile">
@Html.Label(tile.Description)
@if (tile.ImageUrl != null)
{
@Html.Image(tile.ImageUrl.ToString(), tile.Title, htmlAttributes: new { @class = "tile_img" })
}
</a>
</div>
}
</div>
@section Scripts{
<script type="text/javascript">
$(document).ready(function ($) …In ASP.NET Core MVC it is possible to define a script section for a page like this:
@section scripts {
<script>
alert('hello');
</script>
}
And if the the layout contains :
@RenderSection("Scripts", required: false)
your script(s) will be rendered. This come in handy per example to guarantee that the scripts will be rendered after all javascript includes like jQuery.
But how to render a script in a partial view?
从局部视图添加外部文件的最佳方法是什么？
我需要做这样的事情
部分视图中的代码:
@{
var files = new List<string>();
files.Add("some path");
files.Add("some path");
ViewBag.Files = files;
}
在布局页面中
@foreach (var file in ViewBag.Files) {
@file
}
这实际上并没有起作用
asp.net-mvc ×7
razor ×7
asp.net ×3
c# ×2
javascript ×2
.net ×1
.net-core ×1
asp.net-core ×1
jquery ×1
performance ×1
razor-2 ×1
widget ×1