我正在使用datatables插件来处理我们的表格。 我们有这个用例,我们需要使用bServerSide和sAjaxSource通过ajax调用来获取数据(分页),但是我们只想对该页面上的数据进行排序,而不是从服务器中获取已排序的数据,就像在我们的例子中这样读取会很贵。
有可能吗?如果是,请建议如何继续。 提前致谢!!
答案 0 :(得分:4)
我已经阅读过可能对您有所帮助的讨论:基本上您必须使用这些选项对表格进行初始化;
"bServerSide" : false,
"sAjaxSource" : "path to your ajax source"
这样,数据只加载一次,所有过滤都由客户端完成。
如果您想加载更多数据,可以使用fnReloadAjax。您可以阅读this关于该主题的讨论,我认为它具有您需要的所有答案。
编辑 - 使用管道,您可以避免频繁调用服务器进行分页(如果您过滤数据,则会对服务器进行调用)。 如果您只想将数据提供给服务器一次,然后过滤数据客户端,则必须禁用服务器端处理(白色以上选项集)。如果禁用服务器端处理,则可以为用户提供使用“fnReloadAjax”(例如按钮)从服务器获取其他数据的方法。
我仍然没有得到,您是否需要从服务器获取一些其他数据或用户首先获得的任何数据?
编辑2 - 如果您不想调用服务器,则可以通过增强现有表来避免使用AJAX。只需像这样创建html服务器端:
<table width="770" border="0" id='rdr_home' class='tablesorter'>
<thead>
<tr>
<th>col1</th>
<th>col2</th>
<th>col3</th>
</tr>
</thead>
<tbody>
<?php
foreach ($rows as $row){
//echo all rows here (be careful as for each row you must
//have as many <td> as the column: no colspan!
}
?>
</tbody>
</table>
然后像这样创建你的数据表
oTable = $('.tablesorter').dataTable({
"aaSorting": [[2, "asc"]],
"bAutoWidth": false,
"bFilter": false,
"sDom": 'T<"clear">lfrtip',
"aoColumns": [
{ "sType": "html" },
{ "sType": "html" },
null
],
"oLanguage": {
"sUrl": "templates/rhuk_milkyway/dataTables/media/language/it_IT.txt"
}
});
有了这个,你就有了分页和过滤服务器端
编辑3 - 在你提到的情况下(datatables处理paginetion但没有调用过滤)你必须添加som额外的插件,我想。您必须在这样的inizialization fase中禁用数据表的过滤器和分类器;
"bFilter": false,
"bSort": false,
然后使用另一个组件对屏幕上的内容进行排序。您可以在这里查看有关排序和过滤的解决方案:http://silverwareconsulting.com/index.cfm/2008/10/2/jquery-autofiltering-table
(我个人不喜欢通过点击进行过滤的想法,但如果您想根据自己的喜好使用更多,可以在此基础上进行构建),在任何情况下,如果您不能使用数据表内置过滤器允许服务器端分页
答案 1 :(得分:4)
我有一些几乎相同的运行,解决方案一直在流水线 - 没有其他神奇的东西,也没有必要结合其他解决方案。将管道容量设置得很高 - 在我的情况下,我基本上抓住了5个“组”结果(页面*显示结果)向前和向后 - 并且相信Datatables将完成剩下的工作。
在我的应用程序的一个实例中,我正在处理500万条记录。是的,这很多。我已经对系统的各种元素进行了大量测试,包括查询,数据库优化,索引和UI模式使用。所有人都指出这个系统对于这种情况来说是最有效的。对于您的情况,我强烈建议您进行一些性能监控,无论您的UI决定是否存在哪些(如果有)瓶颈存在。在我的500万+记录系统中,我正在查看大约2-4秒的查询时间和每页+ 5%的加载或排序,这当然是可管理的。我有数百个用户和其他一些流程同时处理,我们看到自从大约6个月前实现多个DataTable以来没有明显的滞后。
从UI的角度来看,仅对屏幕数据进行排序的弱点在于它不直观。当我可以访问网格上的数千或数百万条记录并对其进行排序或过滤时,我希望看到所有可用记录的排序和过滤。这听起来很愚蠢,但请记住,UI设计的科学就是创造对用户“熟悉”的模式。