5 万行
此示例展示了管理较大数据量（此案例中为 50k 行）时的性能。
请注意，对于大于此数量的数据集（例如数百万行），您应考虑使用 DataTables 的服务器端处理模式。SearchBuilder 为服务器端处理添加了一些参数，在此处详细说明。
| 姓名 | 职位 | 办公室 | 分机号 | 开始日期 | 工资 |
|---|---|---|---|---|---|
| 姓名 | 职位 | 办公室 | 分机号 | 开始日期 | 工资 |
- Javascript
- HTML
- CSS
- Ajax
- 服务器端脚本
- 注释
下面显示的 Javascript 用于初始化此示例中显示的表格
$('#example').DataTable({ ajax: '../../../../examples/ajax/data/data_50k.txt', columns: [ { data: 'name' }, { data: 'position' }, { data: 'office' }, { data: 'extn' }, { data: 'start_date' }, { data: 'salary' } ], layout: { top1: 'searchBuilder' } });
new DataTable('#example', { ajax: '../../../../examples/ajax/data/data_50k.txt', columns: [ { data: 'name' }, { data: 'position' }, { data: 'office' }, { data: 'extn' }, { data: 'start_date' }, { data: 'salary' } ], layout: { top1: 'searchBuilder' } });
除了以上代码之外，还会加载以下 Javascript 库文件以用于此示例
下面显示的 HTML 是原始 HTML 表元素，在经过 DataTables 增强之前
此示例使用了额外的 CSS，超出库文件加载的内容（如下所示），以便正确显示表格。使用的其他 CSS 如下所示
在示例中加载了以下 CSS 库文件以提供表格样式
此表格通过 Ajax 加载数据。最新加载的数据如下所示。此数据会自动更新，因为任何附加数据都已加载。
用于执行此表的服务器端处理的脚本如下所示。请注意，这只是使用 PHP 的一个示例脚本。服务器端处理脚本可以用任何语言编写，使用 DataTables 文档中描述的协议。