1. 首页
  2. 问答
  3. 如何在一个视图中呈现强类型的局部视图？

如何在一个视图中呈现强类型的局部视图？

2012-06-29 52 views
4

我是这个asp网络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>

那么，如何添加在其他观点我克瑞亚对资产类型的新的部分视图，控制器看起来像什么，我仍然通过转到url /资产转到页面，以及如何在2个部分视图之间传递值，因为我需要知道选择了哪个资产在左侧进行编辑？

感谢

来源

2012-06-29 David Kethel

回答

8

如果我理解正确的，你有一个单一的查看您想要在一个分部视图中显示资产列表的位置，以及在选定时编辑资产的另一个分部视图。

首先你应该创建两个部分视图。

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您在使用Html.Partial/Html.RenderPartial的Assets.cshtml调用而另一个则在点击资产链接时被调用。

索引。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库）

Ex。 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); 
}

UPDATE：

有两种方法可以将模型加载到Assets.cshtml局部视图。第一种方法是创建一个包含资产列表作为属性的视图模型，并用此视图模型强制键入index视图。然后您可以拨打Html.Partial将资产传递给它。

Ex。

public class IndexViewModel 
{ 
    public IList<Asset> Assets; 
    .. other properties if there any 
}

Index.cshtml

@model IndexViewModel 

@Html.Partial("Assets", Model.Assets).

第二的aproach是你可以有一个孩子的行动，获得资产的从数据库列表，并返回局部视图。在这种情况下，您不需要强行键入Index视图。

[ChildActionOnly] 
public PartialViewResult Assets() 
{ 
    var assets = .. get from db 
    return View(assets); 
}

您甚至可以从Index孩子行动

@Html.Action("Assets")

您可以用哪一个最适合你的。

来源

2012-06-29 04:17:27 VJAI

+0

很感谢。只是想知道资产局部视图如何获取其数据，它是否在控制器上拥有自己的操作方法。 [这个问题]（http://stackoverflow.com/questions/1371031/asp-net-mvc-partial-view-controller-action）。建议索引具有列表并将其传递给partial，在这种情况下，index视图需要与资产列表强制类型化。这是最好的方法吗？ –

+1

对不起，我错过了这么说。尽管我更新了我的答案。 – VJAI

相关问题

 相关问题