list - 用于 Web 的长检查列表 ui 模式

Question

我有一个数据输入页面，需要用户从列表中进行一些选择。目前，它只是一个检查列表，其中包含大约 10 个可以勾选的项目，但很快就会扩展到大约 230 个。处理大量可选项目的良好 UI 范例是什么？我正在考虑双列表类型控制。

Answer 1

双列表，但是，对于大量不可分组的元素:

• 必须能够选择多个元素(废话!)
• 应该能够通过点击选择所有元素
• 应该能够搜索(在任一列表中)并选择所有匹配的元素

此外，如果列表非常大(1k+)，您可能会遇到渲染缓慢的问题。如果是这样，您还可以对列表进行“分页” - 例如仅显示前 N 个元素，允许从中进行选择，然后能够将“框架”移动到接下来的 N 个元素。

(顺便说一句，以上所有内容都是我们在企业 Web 应用程序中实现的解决方案的真实属性，该应用程序需要一个包含 30k 可能值且无法分组的选择列表)。