Question

我是这个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部分视图，因为我需要知道在左侧选择了哪个资产进行编辑？

由于

Answer 1

如果我理解正确，您只有一个视图，您希望在一个局部视图中显示资产列表，另一个局部视图在选择时编辑资产。

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

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，而在点击资产链接时将调用另一个。{/ p>

<强> 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);
}

您可以将Index中的子操作称为

@Html.Action("Assets")

您可以使用哪一个最适合您。

Answer 2

您处于正确的轨道上，您需要创建两个部分视图并将它们放在父视图中。您还可以考虑视图中的AJAX调用来更新部分。这是一篇文章，介绍了视图模型需要查看的步骤和方式 - Partial views in ASP.NET MVC 3 w/the Razor view engine

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

2 个答案: