Dav*_*hel 4 asp.net-mvc partial-views razor
我是这个asp net mvc的新手,但在网络表格方面有很强的背景.
我想实现一个具有左侧资产菜单的页面,当您单击其中一个资产时,该资产的详细信息可以在同一页面的右侧进行编辑.
现在我想我将需要使用2个强类型的局部视图.1表示左侧菜单,类型为资产列表,1表示资产类型右侧面板.
到目前为止我的左手菜单工作
调节器
public class AssetsController : Controller
{
//
// GET: /Assets/
public ActionResult Index()
{
var assets =Repo.getAssetList();
return View(assets);
}
}
布局视图
@model IList<CasWebSite.Models.Asset>
<!DOCTYPE html>
<html>
<head>
<title>title</title>
</head>
<body>
<h1>
Assets</h1>
@RenderBody()
</body>
</html>
索引视图
@model IList<CasWebSite.Models.Asset>
@{
Layout = "_Layout.cshtml";
}
<ul>
@foreach (var asset in Model)
{
<li>@asset.Name </li>
}
</ul>
那么我如何在其他视图中添加我创建一个类型为Asset的新局部视图,控制器会是什么样的,我仍然会通过转到url/assets转到页面,以及如何在2部分之间传递值视图,因为我需要知道在左侧选择了哪个资产进行编辑？
谢谢
如果我理解正确,您只有一个视图,您希望在一个局部视图中显示资产列表,另一个局部视图在选择时编辑资产.
首先,您应该创建两个部分视图.
Assets.cshtml(局部视图)
@model IList<Models.Asset>
.. iterate the model and display the menu of assets
EditAsset.cshtml(局部视图)
@model Models.Asset
.. create the form and render the fields for editing
现在在主视图中,Index.cshtml您必须调用Assets.cshtml使用,Html.Partial/Html.RenderPartial而在单击资产链接时将调用另一个.
Index.cshtml
@Html.Partial("Assets", Model.Assets) @*rendering the partial view*@
... other html
<div id="editAssetContainer"> @*edit form placeholder*@
</div>
请注意,您还应该editAssetContainer在其中显示一个占位符,以显示编辑表单.
现在,未决事项是如何在点击资产链接时在占位符中呈现编辑表单.您可以通过两种方式实现:直接使用jquery或使用Ajax.ActionLink.您可以在Asset.cshtml部分视图中将所有资产链接创建为ajax链接.)如果您正在使用Ajax.ActionLink,请不要忘记包含不显眼的ajax库)
防爆.Ajax.ActionLink
@Ajax.ActionLink(linkText,
"EditAsset", // the action that returns the partial view
new {assetId = @asset.Id }, // the assetId that to be passed to the action
new AjaxOptions // you can specify the targetid and others here..
{ UpdateTargetId = "editAssetContainer",
InsertionMode = InsertionMode.Replace
}
)
在这两种情况下,您需要在控制器中返回一个动作EditAsset.cshtml.
public PartialViewResult EditAsset(int assetId)
{
var asset = .. get asset using assetId from db.
return PartialView(asset);
}
更新:
有两种方法可以将模型加载到Assets.cshtml局部视图中.第一种方法是您可以创建一个包含资产列表作为属性的视图模型,并index使用此视图模型强烈键入视图.然后你可以调用Html.Partial将资产传递给它.
防爆.
public class IndexViewModel
{
public IList<Asset> Assets;
.. other properties if there any
}
Index.cshtml
@model IndexViewModel
@Html.Partial("Assets", Model.Assets).
第二个方法是你可以有一个子操作,从数据库中获取资产列表并返回局部视图.在这种情况下,您无需强烈键入Index视图.
[ChildActionOnly]
public PartialViewResult Assets()
{
var assets = .. get from db
return View(assets);
}
您可以从Indexas 调用子操作
@Html.Action("Assets")
您可以使用哪一个最适合您.
| 归档时间： |
|
| 查看次数： |
13050 次 |
| 最近记录： |