服务器端处理(5,000,000 行)
DataTables 的服务器端处理模式是一个与 Scroller 完美结合的功能。服务器端处理可用于显示大型数据集,由服务器执行数据处理,而 Scroller 则优化在滚动视口中显示数据。
在使用服务器端处理时,Scroller 会等待一小段时间来允许滚动完成,然后再向服务器请求更多数据(默认 200mS)。这可以防止你对自己的服务器执行 DoS 攻击!
此示例显示 Scroller 使用服务器端处理模式和 500 万行数据。重要提示 此特定示例使用 ajax
作为函数来模拟数据,以显示 Scroller 显示大型数据集的能力。它没有真正的数据库支持!你通常不会使用 ajax
作为生成数据的函数,而是用作获取真实数据的位置的 URL!
ID | 名字 | 姓氏 | 邮政编码 | 国家/地区 |
---|
- Javascript
- HTML
- CSS
- AJAX
- 服务器端脚本
- 注释
下面显示的 JavaScript 用于初始化此示例中显示的表格
$('#example').DataTable({ ajax: function (data, callback, settings) { var out = []; for (var i = data.start, ien = data.start + data.length; i < ien; i++) { out.push([i + '-1', i + '-2', i + '-3', i + '-4', i + '-5']); } setTimeout(function () { callback({ draw: data.draw, data: out, recordsTotal: 5000000, recordsFiltered: 5000000 }); }, 150); }, processing: true, ordering: false, scroller: true, scrollY: 200, searching: false, serverSide: true });
new DataTable('#example', { ajax: function (data, callback, settings) { let out = []; for (var i = data.start, ien = data.start + data.length; i < ien; i++) { out.push([i + '-1', i + '-2', i + '-3', i + '-4', i + '-5']); } setTimeout(() => { callback({ draw: data.draw, data: out, recordsTotal: 5000000, recordsFiltered: 5000000 }); }, 150); }, processing: true, ordering: false, scroller: true, scrollY: 200, searching: false, serverSide: true });
除上述代码外,还加载了以下 Javascript 库文件以用于此示例
下面显示的 HTML 是原始 HTML 表元素,尚未经过 DataTables 增强
此示例使用了来自库文件(下面)的一点点其他 CSS,以便正确显示表格。下面显示了所使用的其他 CSS
为了用于此示例并提供表格样式,加载了以下 CSS 库文件
此表格通过 Ajax 加载数据。下面显示已加载的最新数据。此数据将随着加载任何其他数据自动更新。
用于执行此表格服务器端处理的脚本如下所示。请注意,这只是一个使用 PHP 的示例脚本。服务器端处理脚本可以用使用 DataTables 文档中介绍的协议 的任何语言编写。