新视图或部分视图答案

【问题标题】：New View or Partial View新视图或部分视图
【发布时间】：2011-12-26 05:41:29
【问题描述】：

情况是这样的：

我有一个 ASP.NET MVC 4 应用程序。当我运行应用程序时，我转到一个页面，控制器上的 Index - 操作将 Guid 作为 id - 参数。使用该 ID，我从数据库中获取项目列表并将其放入 ViewModel。这个 ViewModel 被传递给一个 View，它把所有的项目作为一个 ActionLink 列出（必要时可以改变）。当我单击其中一个项目时，我想根据所选链接的 id 获取其他项目的列表，并在第一个列表旁边显示这个新列表。

但这是我的问题（以及我被困 2 天的地方）：做这个的最好方式是什么？转到新页面或使用局部视图。因为我一直在尝试两者，显然我一定做错了一些事情，因为似乎没有一个工作。我不需要任何 AJAX 东西或类似的助手，只需要一个正确的方法来完成这项工作...... :)

提前致谢！

更新：我已经拥有的代码

查看

@foreach (var order in Model.Orders)
{
    <p>@Html.ActionLink(order.Name,
                        "OrderItems",
                        "OrdersController",
                        new { id = order.Id },
                        null)
    </p>
}

@if (Model.Detail != null)
{
    @Html.Partial("_OrderItemsByOrder", Model)
}

控制器

public ActionResult Index(Guid id)
{
    var orders = Services.GetOrders(id);
    var viewModel = new OrdersViewModel { Orders = orders };
    return View(viewModel);
}

public ActionResult OrderItems(Guid id, OrdersViewModel model)
{
    var orderItems = Services.GetOrderLines(id);
    var viewModel = new OrdersViewModel
    {
        Orders = model.Orders,
        Detail = new OrderDetailViewModel { OrderItems = orderItems }
    };
    return PartialView(viewModel);
}

【问题讨论】：

我对您到底想要返回给用户的内容感到有些困惑。您是否尝试返回订单列表，然后能够单击/选择它们并查看该订单的详细信息？

标签： c# asp.net-mvc partial-views asp.net-mvc-4

【解决方案1】：

您可能（为了用户可用性）想要使用 AJAX 并从 AJAX 响应中下拉“其他项目”列表（可能是 JSON，或者如果您真的想避免使用 javascript，则为部分 HTML 页面）

如果您真的不想使用 AJAX，您可以拉出所有项目以及所有“其他项目”并将它们存储在最初的“隐藏”字段中，然后执行两个选择框。

http://www.plus2net.com/javascript_tutorial/dropdown-list.php

示例：http://www.plus2net.com/javascript_tutorial/dropdown-list-demo.php

老实说，我会选择 AJAX 选项，除非人们经常使用每个下拉菜单，或者选项的数量非常有限。

阿贾克斯：http://www.plus2net.com/php_tutorial/ajax_drop_down_list.php

只是想指出，它不需要是用于选择/填充的下拉框，您只需更改代码即可填充 div 或您想要的任何元素:)

【讨论】：

很抱歉，您的回答并没有为我解决问题。用户 - 可用性现在不是问题，这是我需要的如何做到这一点的基本结构..
也许你可以发布你现在拥有的东西？您是否查看了示例并查看了源代码以了解它们在做什么？
@Abbas 您需要为此使用 javascript。您有 2 个选项：在初始页面加载时拉下所有“其他选项”，或者使用 AJAX 根据需要动态拉下它们。您不希望每次有人选择第一个选项时都加载不同的页面，因为这会更难，同时用户友好性也更低。
我用我拥有的一些代码编辑了我的帖子。好的，现在如果我使用 AJAX，我该怎么做，因为我不是这方面的专家。我应该在同一个视图中呈现结果还是...？
在 AJAX 的情况下：一个视图包含您所拥有的，一个视图仅呈现包含“其他项目”的列表。

【解决方案2】：

有几种方法可以实现这样的主页面/详细信息页面，确实没有最好的方法来做到这一点。 AJAX 可能是最优雅和用户友好的，但它绝不是“正确”的答案。

查看您发布的代码，您可以做的最简单的事情就是拥有一个操作方法和一个视图。

public class OrdersViewModel
{
    public IEnumerable<Order> Orders { get; set; }
    public OrderItems SelectedOrderItems { get; set; }
}

public ActionResult Orders(Guid id, Guid? orderId)
{
    var model = new OrdersViewModel();
    model.Orders = Services.GetOrders(id);

    if (orderId != null)
    {
        model.SelectedOrderItems = Services.GetOrderLines(orderId);
    }

    return View(model);
}

这种相当基本的方法的缺点是，您可能有 2 个 Guid 弄脏了您的 Url，并且此示例无法验证 orderId 是否实际上由（用户？） Id 拥有 - 无论第一个 Guid 代表什么。不过你可以用几行代码来处理这个问题。

如果您不介意更改 URL，则更优雅的处理方法是坚持使用第二种操作方法。我希望您可以从详细信息本身确定订单详细信息的“所有者”，或者以某种方式不需要您将其传递给操作方法。这有助于确保您的视图仅显示来自正确母版的详细信息。

public ActionResult OrderDetails(Guid id /*the id of the order*/)
{
    var orderLines = Services.GetOrderLines(id);

    var model = new OrdersViewModel();
    //ideally you could get to the "owner id" of the order from the order lines itself
    //depending on how your domain model is set up
    model.Orders = Services.GetOrders(orderLines.Order.OwnerId); 
    model.SelectedOrderItems = orderLines;

    return View("Orders", model); //render the same view as the Orders page if like
}

您在问题中列出的观点可以大致保持不变。呈现代表所有订单的操作链接。如果模型中有订单详情，则渲染订单详情：

@if (Model.SelectedOrderItems!= null)
{
    /* markup here or a render partial call */
}

如果您在其他页面上呈现订单详细信息，您需要将订单详细信息放在局部视图中，这样您就不会重复任何标记。如果它只在此处呈现，那么您就没有理由无法在此视图中正确显示您的标记。

【讨论】：

【解决方案3】：

我会建议这样的事情：

您有一个带有动作的控制器。动作需要两个参数，一个带有您的 guid，一个带有其他 id 的可选参数
您的“主视图”列出了您的项目
在您的控制器中，添加另一个动作，这次只有一个参数，一个id
添加另一个视图，但这次是部分视图，其中列出了您的其他项目

Action 1 在视图模型中放置一个包含项目的列表，以及一个可选的 id 以呈现一些其他项目。

动作 3 在视图模型中放置一个包含其他一些项目的列表

动作 1 渲染视图 2，动作 3 渲染视图 4。视图 2 渲染，如果视图模型这样，动作 3。

基本上，当没有选择特定项目时，执行链将是这样的： 1 => 2 => 完成

但是当一个项目被选中时，链会是这样的： 1 => 2 => 3 => 4

（当然，这只是一种做事方式..）

【讨论】：