选择整合
此示例展示了 StateRestore 扩展与 Select 扩展的协作方式。在使用 StateRestore 时，可以储存和恢复 Select 中的选择。
| 姓名 | 职位 | 办公室 | 工资 |
|---|---|---|---|
| 姓名 | 职位 | 办公室 | 工资 |
- Javascript
- HTML
- CSS
- Ajax
- 服务器端脚本
- 评论
下方展示的 Javascript 用于初始化此示例中显示的表格
$('#example').DataTable({ ajax: '../data/objects.txt', columns: [ { data: 'name' }, { data: 'position' }, { data: 'office' }, { data: 'salary' } ], layout: { topStart: { buttons: ['createState', 'savedStates'] } }, rowId: 'id', select: true });
new DataTable('#example', { ajax: '../data/objects.txt', columns: [ { data: 'name' }, { data: 'position' }, { data: 'office' }, { data: 'salary' } ], layout: { topStart: { buttons: ['createState', 'savedStates'] } }, rowId: 'id', select: true });
除了上述代码，还载入以下 Javascript 库文件用于此示例
下方展示的 HTML 是原始 HTML 表格元素，在未被 DataTables 增强前
为了正确显示表格，此示例使用了一些超出库文件载入（如下方所示）的附加 CSS。下方显示了使用的附加 CSS
载入了以下 CSS 库文件用于此示例，以为其表格提供样式
此表格通过 Ajax 载入数据。下方显示了载入的最新数据。当载入任何附加数据时，此数据会自动更新。
下方展示了用于为表格执行服务器端处理的脚本。请注意，这只是一个使用 PHP 的示例脚本。服务器端处理脚本可以使用任何语言编写，使用 DataTables 文档中描述的协议。