什么是好的带有选项卡的 JavaScript 网格？
我想使用 ASP.NET MVC 中的 JavaScript 框架显示 3 组表格数据。我知道我可以在选项卡中嵌入一个单独的网格，但这似乎效率很低，尤其是在涉及大型数据集时，因为我想象会创建 3 个单独的网格。我还没有找到一个 JavaScript 数据网格来模拟电子表格使用多个选项卡的功能。来自 YUI 的这个例子可能很接近：
http://developer.yahoo.com /yui/examples/datatable/dt_dynamicfilter_source.html
我对 jQuery 有点熟悉，但愿意切换到任何使这变得容易的框架。我真的不需要编辑数据。有什么建议吗？
编辑：我并不是说这是关于 jQuery 的。也许有关我的场景的一些细节会有所帮助，正如其中一条评论中所建议的那样。我想显示来自包含数千条记录的订购系统的表格数据。我想要 3 个选项卡：
- 系统中输入的所有尚未付款的订单。
- 来自特定供应商的所有订单。
- 所有已付款的订单。
由于每个类别都有数千行，因此我只想在用户开始分页时加载数据。
我认为拥有 3 个带有 3 个独立网格（每个选项卡内一个）的选项卡不会提高性能。但我还没有真正尝试过，所以我可能对过早优化感到内疚。我正在寻找内置选项卡支持的网格。我认为没有适用于 jQuery 的。也许是ExtJS？
I have 3 sets of tabular data I want to display with a JavaScript framework in ASP.NET MVC. I know I can embed a separate grid in a tab, but this seems inefficient especially when large datasets are involved since I imagine 3 separate grids would be created. I haven't found a JavaScript datagrid which emulates what a spreadsheet does with multiple tabs. This example from YUI might come close though:
http://developer.yahoo.com/yui/examples/datatable/dt_dynamicfilter_source.html
I'm a little familiar with jQuery, but would be willing to switch to any framework which makes this easy. I don't really need to edit the data. Any suggestions?
EDIT: I didn't mean this to be about jQuery. Maybe some details about my scenario would help, as suggested in one of the comments. I want to display tabular data from an ordering system containing thousands of records. I'd like 3 tabs:
- All orders entered in the system which haven't been paid for yet.
- All orders from a specific vendor.
- All orders which have been paid for.
Since each category has thousands of rows, I only want to load data if the user starts paging.
I thought having 3 tabs with 3 separate grids (one within each tab) wouldn't be performant. I haven't actually tried though, so I'm probably guilty of prematurely optimizing. I'm looking for a grid with tab support built-in. I don't think there's one for jQuery. Perhaps ExtJS?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（4）
既然您使用 Ext JS 标记了它，我会提到使用 Ext JS 将网格渲染到选项卡中非常简单。它还支持延迟加载/渲染，以便最初仅加载第一个选项卡/网格，然后在第一次访问时加载其他选项卡/网格。在不知道您的具体要求的情况下，很难进一步发表评论。
编辑（基于编辑的问题）：Ext网格不直接支持选项卡，但它们可以嵌入到TabPanel中，正如我提到的以获得相同的效果。然而，根据你的描述，对我来说这听起来更像是一个过滤场景。当只有一个网格可见时，我不认为多个网格的开销有什么意义，并且每个网格的目的都是显示相同数据的特定视图（即过滤器）。我只会有一个带有工具栏的网格或提供过滤器之间切换的其他方法，并使用 Ext 的内置存储过滤/查询来按需创建视图。 Ext 网格支持开箱即用的分页（客户端或服务器，在您的情况下它将是数千条记录的服务器）。还有一个非常流行的插件，名为 LiveGrid，它提供虚拟滚动功能- 大数据集的分页。
我不一定提倡 Ext 胜过任何其他框架——我只是碰巧最熟悉它，并且我认为它可以很好地解决您的问题。我建议您亲自尝试一下以确保确定。
Since you tagged this with Ext JS, I'll mention that it's quite simple to render grids into tabs using Ext JS. It also supports deferred load/render, so that only the first tab/grid would load initially, then the others would be loaded on first access. Without knowing your specific requirements it's hard to comment further.
EDIT (based on edited question): Ext grids don't directly support tabbing, but they can be embedded within a TabPanel as I mentioned for the same effect. However, based on your description, it sounds more like a filtering scenario to me. I don't see the point in having the overhead of multiple grids when only one will ever be visible, and each one's purpose is to show a specific view (i.e. filter) of the same data. I would just have a single grid with a toolbar or some other method of providing your toggle between filters, and use Ext's built-in store filtering/querying to create your views on demand. The Ext grid supports paging out of the box (client or server, in your case it would be server for thousands of records). There is also a very popular plugin called LiveGrid that provides for virtual scroll-paging of large data sets.
I'm not necessarily advocating Ext over any other framework -- I just happen to be most familiar with it and I think it could solve your problem quite nicely. I would suggest trying it out for yourself to be sure.
jQuery Grid 是人们经常使用的东西。我用它，效果非常好。
jqGrid 链接
我不会绘制带有三个选项卡的网格。我将使用带有选项卡控件的单个网格，然后根据需要通过 jQuery 加载数据。
或者也许有三个 PartialViews，当您点击选项卡时可以动态加载它们。
jQuery Grid is kinda what people use a lot. I use it and it's pretty good.
jqGrid Link
I wouldn't draw a grid with three tabs. I'd use a single grid with a tab control and then load data via jQuery as required.
Or maybe have three PartialViews that you can load dynamically when you hit a tab.
您还可以使用 dhtmlx 网格。
You could also use dhtmlx grid.
您可以使用 JS 选项卡对象 来创建选项卡。
并使用 javascript 网格框架 创建网格并将数据填充到网格中。
You could use JS tab object to create tabs.
And use javascript grid framework to create grids and populate data into grids.