如何解耦关系型 MVC 数据

Question

考虑这个场景：

我想为 Northwind 数据库构建一个 MVC 应用程序。我想要一个列出一些订单的视图，并且想要创建 CustomerID 和 EmployeeID 的链接以及 [OrderDetails] 的详细信息链接，以便当用户单击任何这些链接时，相关数据将显示在同一页面中。

我的问题是如何将这些相互关联的数据解耦到在页面中显示相关数据的视图和控制器，以及负责信息各个部分的控制器。

另外，如何为此示例配置路由？

<table width="500px">
    <tr>
        <th></th>
        <th>
            OrderID
        </th>
        <th>
            CustomerID
        </th>
        <th>
            EmployeeID
        </th>
        <th>
            OrderDate
        </th>
        <th>
            RequiredDate
        </th>
        <th>
            ShippedDate
        </th>
        <th>
            ShipVia
        </th>            
        <th>
            OrderDetails
        </th>   
    </tr>

<% foreach (var item in Model) { %>

    <tr>
        <td>
            <%: Html.ActionLink("Edit", "Edit", new { id=item.OrderID }) %> |
            <%: Html.ActionLink("Details", "Details", new { id=item.OrderID })%> |
            <%: Html.ActionLink("Delete", "Delete", new { id=item.OrderID })%>
        </td>
        <td>
            <%: item.OrderID %>
        </td>
        <td>
            <%: item.CustomerID %>
        </td>
        <td>
            <%: item.EmployeeID %>
        </td>
        <td>
            <%: String.Format("{0:g}", item.OrderDate) %>
        </td>
        <td>
            <%: String.Format("{0:g}", item.RequiredDate) %>
        </td>
        <td>
            <%: String.Format("{0:g}", item.ShippedDate) %>
        </td>
        <td>
            <%: item.ShipVia %>
        </td>            
        <td>
            <%: Html.ActionLink("OrderDetails", "GetOrderDetails", new { id = item.OrderID })%>
        </td>
    </tr>

<% } %>

</table>

<p>
    <%: Html.ActionLink("Create New", "Create") %>
</p>

<div>
    <p>
        <% Html.RenderPartial("GetOrderDetails"); %>
    </p>
    <%--<uc1:GetOrderDetails ID="GetOrderDetails1" runat="server" />--%>
</div>

和订单详细信息部分视图：

<table>
    <tr>
        <th></th>
        <th>
            OrderID
        </th>
        <th>
            ProductID
        </th>
        <th>
            UnitPrice
        </th>
        <th>
            Quantity
        </th>
        <th>
            Discount
        </th>
    </tr>

<% foreach (var item in Model) { %>

    <tr>
        <td>
            <%: Html.ActionLink("Edit", "Edit", new { id=item.OrderID }) %> |
            <%: Html.ActionLink("Details", "Details", new { id=item.OrderID })%> |
            <%: Html.ActionLink("Delete", "Delete", new { id=item.OrderID })%>
        </td>
        <td>
            <%: item.OrderID %>
        </td>
        <td>
            <%: item.ProductID %>
        </td>
        <td>
            <%: String.Format("{0:F}", item.UnitPrice) %>
        </td>
        <td>
            <%: item.Quantity %>
        </td>
        <td>
            <%: item.Discount %>
        </td>
    </tr>

<% } %>

</table>

<p>
    <%: Html.ActionLink("Create New", "Create") %>
</p>

global.asax：

public static void RegisterRoutes(RouteCollection routes)
    {
        routes.IgnoreRoute("{resource}.axd/{*pathInfo}");



        routes.MapRoute(
            "Default2", // Route name
            "{controller}/{action}/{OrderId}/{CustomerID}", // URL with parameters
            new { controller = "NorthwindOrders", action = "Index", OrderId = UrlParameter.Optional, CustomerID = UrlParameter.Optional } // Parameter defaults
        );

        routes.MapRoute(
            "Default", // Route name
            "{controller}/{action}/{id}", // URL with parameters
            new { controller = "Home", action = "Index", id = UrlParameter.Optional } // Parameter defaults
        );
    }

给定此结构；单击任何 OrderDetails 链接时，如何在订单列表下显示订单详细信息？

而且，为什么当我单击 OrderDetails 链接时 URL 显示如下：

http://localhost:49444/NorthwindOrders/GetOrderDetails?id=10250

我希望 URL 显示如下：

http://localhost:49444/NorthwindOrders/GetOrderDetails/10250

Answer 1

对于您的路由问题：

如果您像这样设置路由：

    routes.MapRoute(
        "orderdetails", // Route name
        "{controller}/{action}/{id}", // URL with parameters
        new { controller = "NorthwindOrders", action = "GetOrderDetails", id = UrlParameter.Optional, CustomerID = UrlParameter.Optional } // Parameter defaults
    );

它将按照您想要的方式构建 URL。

（或者，您可以将 GetOrderDetails 操作的参数重命名为 string OrderId，它将找到按照您想要的方式格式化 URL 的路由。）

至于您的主要问题：

如何我是否根据链接点击“动态”加载页面上的内容？

有两种方法可以解决此问题：

• 回发页面。
• AJAX / 动态加载页面 HTML 中的数据和元素。

在回发场景中：

在这种场景中，您的链接将全部转到构建模型的操作，该模型包含主页中的订单列表，并且对于您单击的特定订单的详细信息，您将使用该订单的具体信息填充您的模型命令。然后，您的 ActionResult 返回的是相同的视图（或者至少看起来相同的视图），并且您的视图将使用 PartialView Html 帮助器来呈现详细信息。

OrderViewModel:

public class OrderViewModel
{
  public IList<Order> Orders {get;set;}
  public OrderDetail Details {get;set;}
}

OrderView.aspx:

<%@ Page Title="" Language="C#" Inherits="System.Web.Mvc.ViewPage<OrderViewModel>" %>
<%:Html.DisplayFor(m=>m.Orders)%> <%-- Displays the Table above listing orders --%>
<%:Html.DisplayFor(m=>m.Details)%> <%-- Displays your custom view of the details --%>

OrderController:

...
public ActionResult List()
{
  var model = new OrderViewModel { Orders = GetAllOrders(), Details = null };
  return View("OrderView", model);
}

public ActionResult GetOrderDetails(string OrderId)
{
  var model = new OrderViewModel { Orders = GetAllOrders(), Details = GetOrder(OrderId) };
  return View("OrderView", model);
}
...

在 Ajax 场景中：

Ajax 场景本质上是相同的，除了您在 ajax 调用中隐藏服务器往返，然后重新加载页面，或者只是一个包含您想要的内容的 div ajax 调用的返回数据中的 html（或 JSON）。

Ajax 方法的优点是您可以在不同的控制器上为要更新的页面的各个部分指定不同的操作。

Answer 2

尼玛，
您可以通过部分视图或渲染操作以及 json 来显示数据来完成
基本示例如下：
http://www.asp.net/mvc/tutorials /iteration-7-add-ajax-functionality-cs

或非常流行的选项是 jquery.dialog() 中任务的显示操作

取决于您想要继续的方式
首席采购官

---

revised:

我的不好。
从逻辑上看是这样的：
这仅取决于您，您想走哪条路。
（从我的角度来看）

分离逻辑的好处是：

1. 易于理解，因为控制器仅与以下操作相关： 订单
2. 如果需要，可以在更多地方使用
3. 易于仅测试小项目，例如一个测试用例/夹具仅用于订单的控制器
4. 对于更复杂的项目很有用

另一方面

1. 将所有内容保留在一个控制器中并按区域分割逻辑一切都
2. 在一起，很容易看到其他方法及其功能

希望这就是您正在寻找的
首席采购官