design-patterns - 用于将单个或多个对象与实体关联的用户界面模式

Question

需要有关实现将单个或多个对象与实体关联的建议。

1. 所有足球队球员均单独注册(例如，他们是“球员”表的一部分)

2. 一支足球队有很多球员。点击顺序如下:-a] 足球队所有者提供足球队的名称和简短描述。b] 现在它想向这个团队添加球员。c] 您可以使用以下按钮“将玩家添加到团队”，该按钮可让您导航到“查看玩家”页面并从那里选择多个用户。

假设这是一个分页的玩家列表，您如何处理以下内容:-

• 您是否为每个玩家提供一个复选框并让经理进行多项选择。
• 如果您需要添加更多玩家，则显示已添加到团队中的玩家是没有意义的。您是否将这些条目标记为不可选择，或者您仍然会显示它们，但提供一些其他指示
• 如果您需要过滤，请在此页面顶部提供搜索过滤器。

正在寻找有关如何实现此功能的想法或已经完成类似操作的网站。

Answer 1

我想要的东西看起来像下面这样:

     Players                     Roster
+---------------+          +---------------+  
|               |          |               |
|               |          |               |
|               |          |               |
|               |          |               |
+---------------+          +---------------+

Filter: ---------

玩家列表中的列表元素(可能)包含有关玩家的图片、名称和其他信息。

“过滤器”文本框将允许用户输入部分名称并过滤列表，以便更轻松地找到所需的播放器。

每个元素都可以拖动到名册列，此时玩家将被添加到名册中。

我故意让这个平台不可知，因为您没有提到这是针对桌面应用程序还是网络应用程序。

由于这是一个网络应用程序，我建议让列表中的每个播放器都有自己单独的 div，使用 jQuery Draggable 启用拖/放功能，并使用 jQuery 的 AJAX 功能回发到服务器以确保玩家将被添加到名单中。