谁能推荐一个性能良好的界面,允许用户在HTML中组织大量的项目?



目前对于"group"管理,您可以在可用组列表中单击组的名称,它将带您到一个带有两个并排的多选择列表框的页面。两个列表框之间是"添加"one_answers"删除"按钮。你从左边的列表中选择所有的"用户",然后点击"添加",他们就会出现在右边的列表中,反之亦然。对于少量的数据,这工作得相当好。

当你开始拥有成千上万的用户时,问题就出现了。这不仅是困难和耗时的搜索(尽管顶部有一个"过滤器",可以根据字符串缩小结果),但你最终会达到一个点,你的电脑的能力和列表项目的数量达到顶点,整个浏览器开始严重滞后。

是否有更好的接口来管理这个?或者当列表中有许多"项目"时,是否有什么众所周知的技巧可以让它表现得更好或更容易使用?

实现一个Ajax函数,该函数挂钩keydown并检查用户到目前为止在搜索/过滤框中输入的字符(服务器端)。当搜索结果低于50时,将这些推送到浏览器进行显示。

或者,您可以使用jQuery UI自动完成插件,并将最小字符数设置为3来触发搜索。这将限制推送到浏览器的列表项的数量。

我会放弃在浏览器中使用本地列表框,而在HTML/CSS中使用列表或表格实现解决方案(取决于您的需要)。然后可以使用JavaScript和AJAX只提取所需的数据子集。观察用户的行为,并在他们真正到达之前拉出接下来的50条记录。这会给人一种在运行时加载所有记录的错觉。

iPhone这样做是为了为它的TableViews保留内存。我会把这个想法应用到你的案例中。

我觉得你说的"过滤器"这个词一板一眼。我不是你所描述的并行多重选择的最大粉丝,但这几乎是无关紧要的,无论你使用什么UX元素,你都会遇到一个问题,因为有数千个项目。因此,过滤。使用搜索字符串进行过滤是一个很好的解决方案,但我怀疑按名称搜索并不是找到管理员想要的用户的最快方法。关于用户你还知道些什么?他们是如何分组的。

例如,如果这些用户是一所高中的学生,我们将知道他们的一些元数据:他们在几年级?他们多大了?他们是哪个专业的?他们的GPA是多少?…在这些元数据上提供过滤是限制一次可用学生数量的一种方法。如果你一开始有太多,这会导致性能问题,考虑限制它们,用一个按钮来加载更多,一次只显示100个。

更新:这里的最后一点基本上是Jesse下面提出的。

相关内容

  • 没有找到相关文章

最新更新