什么是最优雅的桌上手风琴/“显示更多>>”解决方案？
我在这里寻找一些普遍的智慧。
我正在寻找一种优雅简单的方法来限制页面上显示的表中带有“查看全部>>”的行数使整个表格呈现在视图中。我考虑了以下所有内容，...一些组合：
- 两个不同的部分，...其中一个列出了有限数量的行，并带有“查看全部>>”底部的链接和第二个列出所有带有“折叠>>”的链接链接在底部。
- 使用 jQuery
- CSS 解决方案
- ajax
除了您选择其中之一的理由之外，任何链接和/或片段都会有所帮助。我希望最大限度地减少服务器/数据库请求，而不为程序员（我）的独创性创建大量的编码纪念碑：=]
谢谢！
更新：查看此处查看之前编写的代码，可以进行调整。非常感谢 Neal 提供的 jsfiddle.net 资源。
I am looking for some general wisdom here.
I am looking for an elegantly simple way to limit the number of rows in a table that are presented on a page with a "view all >>" to get the whole table presented in the view. I considered all of the following,... some in combination:
- two different partials,... one that lists a limited number of rows with a "view all >>" link at the bottom and a second that lists all with a "collapse >>" link at the bottom.
- using jQuery
- a css solution
- ajax
Any links and / or snippets would be helpful in addition to your rationale for choosing one over another. I would prefer to minimize server / database requests without creating a voluminous coding monument to ingenuity of the programmer (me) :=]
Thanks!
UPDATE: Look here to see code written before that could be adapted. Many thanks to Neal for the jsfiddle.net resource.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
对于大表来说，一个很好的解决方案是网格。我选择的网格是 DataTables
网格解决了很多问题：排序、分页、过滤、ajax 加载和显示/隐藏结果。您可能只是在谈论等式的限制部分，但我认为所有功能在接口中都有价值，因此它们都值得一看。
设置起来很简单，您可以选择三个数据选项：
和标记构建适当的 HTML 表格。网格相应地解释 DOM 和样式。Datatables 是 JQuery 驱动的，因此您必须包含 Jquery 和 DataTables 代码。还有一些 CSS 可以让事情变得“漂亮”，就是这样......非常简单。一旦掌握了窍门，从头开始生成一个新的 DataTable 需要 2-3 分钟。考虑到这些功能，这是对用户界面的最小投资。
至于性能，我有一个可以处理 250 万条记录的 DataTable。它利用 JSON 管道、分页、排序和过滤（以及索引良好的 MySQL 数据库）来维持可接受的性能。
A GREAT solution for big tables is a Grid. My grid of choice is DataTables
Grids solve a lot of problems: sorting, paging, filtering, ajax loading, and showing/hiding results. It's likely you're only talking about the limiting portion of the equation, but I'd submit that ALL the features have a value in interfaces, so they're all worth looking at.
Setting it up is easy and you have three options for data:
<thead>and<tbody>tags. The grid interprets the DOM and styles accordingly.Datatables is JQuery driven, so you'll have to include Jquery and the DataTables code. There is also a bit of CSS to make things "pretty" That's it....pretty easy. Once you get the hang of it, producing a new DataTable from scratch takes 2-3 minutes. Considering the features, that's a minimal investment in your UI.
As to performance, I have a DataTable handling 2.5 million records without fail. It utilizes JSON pipelining, paging, sorting, and filtering (and a well-indexed MySQL DB) to maintain acceptable performance.