MVC3 :: 从详细信息视图导航表，而不是单击表中的详细信息链接

MVC3 :: Navigate table from details view instead of clicking details links in table

本文关键字：详细信息单击链接视图导航 MVC3 更新时间：2023-09-26

>我有一个"索引"视图，显示表中的项目列表。每个项目都有一个链接来显示其详细信息（通过 Ajax 加载的另一个分部视图，替换索引视图）。

单击详细信息链接后，用户现在希望查看"下一项"或"上一项"的详细信息。我们目前有一个反向链接可以再次获取索引视图......用户可以单击任何项目...但她想要的是更多的可用性。

由于项目列表可以被过滤，我认为实现这一目标的唯一方法是通过jQuery或普通JS。

我正在考虑有一些隐藏字段来存储所有项目的 ID......未存储在"索引"视图中（一旦访问详细信息，它就会消失），以便能够从详细信息访问它并创建"下一个后退"链接。但是它感觉很脏...仅列出ID是不够的，因为我应该跟踪哪个是当前ID以查看哪些是下一个和上一个项目。所以。。。可能是一个 JSON 可以做到这一点。

有什么建议或其他方法可以在客户端存储列表吗？该列表可能有 10 到 200 个项目，一旦我再次过滤索引视图或按其他事件过滤，这些项目就会刷新。

我可以看到几种方法。

正如 TheZuck 所说，与其导航到详细信息页面，不如使用内容为详细信息页面的对话框或模式窗口。有了这个，当用户希望导航时，您可以使用 JavaScript 从索引页面访问值。我不太喜欢这个想法，因为它将您的导航逻辑与可能更改的渲染视图内容联系起来。
您可以从索引页保留所需的 ID，并将它们传递到详细信息页。这样做的结果是，为您更改的代码相对较小。不利的一面是，您将在每个导航请求中发布和检索这些ID。
您可以像#2一样做，但增加了将导航控件与详细信息内容本身分开的功能。如果将详细信息推送到分部视图中，现在可以使用 AJAX 帮助程序连接导航控件。单击前进将带您到本地列表中的下一个 id，方法是向控制器中的ActionResult发出 POST 或 GET，该将返回绑定到该 id 的数据的部分视图。我最喜欢这种方法，因为它不会在每个细节导航中往返 id，并且不需要大量自定义 javascript 来访问渲染页面中的 id。它还使您有机会使用加载面板，以防检索数据需要一些时间来检索。

顺便说一句：如果你真的不喜欢将你的ID存储在隐藏的输入字段或javascript变量或列表中，你总是可以使用Session但如果你在一个没有粘性会话的负载平衡环境中，要小心。这样，您就可以在服务器端访问当前筛选的结果。您的导航请求只会发送当前 ID 和所需的导航方向。在控制器中，只需拉动会话，查找 ID 并将指向向前或向后移动（小心环绕，否则确保您有办法不呈现会导致环绕的导航按钮）。

在这些选择中，我喜欢 #3 最适合最佳 UX，特别是如果细节太大而无法像选项 #1 那样在小模态或对话框中很好地呈现。它也可能是响应速度最快的，假设你应用了旁白，你可以访问列表的POCO表示，而不是在JavaScript中序列化和反序列化。如果详细信息页面太小以至于很容易放入对话框或模式窗口，我会考虑 #1。它可以像选项 #1 一样响应迅速，您仍然可以使用 side 来防止在 JavaScript 中操纵 id。

我降低选项 #3 优先级的唯一原因是因为我们的 UX 人员不断拒绝客户对显示数据的"弹出窗口"的请求。她恨他们。我还没有弄清楚这是个人的还是因为用户体验最佳实践为这个决定提供了信息，但这是我从未擅长的事情，所以我没有兴趣找出答案！

好吧，您可以显示详细信息的叠加而不是替换索引视图，在这种情况下，当用户单击上一个/下一个时，您会告诉索引视图层："听着，我正在显示 X，但用户希望看到 x+1，所以请用 x+1 替换我"