Ajax 加载和保存
本例演示了如何在 ajax 中操作状态恢复扩展。
为此，ajax选项的stateRestoreConfig配置对象必须设置为将在尝试保存状态时使用的 URL。随后将通过表的自身 ajax URL 再次加载状态。如果最初传递的 json 中存在stateRestore属性，那么该处存在的状态将加载到表中。
值得注意的是，我们仅提供客户端实现。你必须编写自己的服务器端实现，以保存超出当前会话时间的状态。
滚动条扩展还正在此处使用。这是因为它是加载 ajax 的一种常见使用方式。
| ID | 名字 | 姓氏 | 邮政编码 / 地区代码 | 国家 |
|---|
- Javascript
- HTML
- CSS
- Ajax
- 服务器端脚本
- 评论
下面显示的 Javascript 用于初始化本例中显示的表
$('#example').DataTable({ ajax: { url: '../data/stateRestoreLoad.php', dataSrc: 'data' }, layout: { topStart: { buttons: [ 'createState', { extend: 'savedStates', config: { ajax: '../data/stateRestoreSave.php' } } ] } }, scrollY: 200, scrollCollapse: true });
new DataTable('#example', { ajax: { url: '../data/stateRestoreLoad.php', dataSrc: 'data' }, layout: { topStart: { buttons: [ 'createState', { extend: 'savedStates', config: { ajax: '../data/stateRestoreSave.php' } } ] } }, scrollY: 200, scrollCollapse: true });
除了以上代码外，还加载了以下 Javascript 库文件以用于此例
下面显示的 HTML 是原始 HTML 表元素，在被 DataTables 优化之前
为了正确显示该表，本例使用了一些超出了从库文件（如下所示）加载的附加 CSS。下面显示的是使用的附加 CSS
加载了以下 CSS 库文件以用于本例，以提供表的样式
此表通过 Ajax 加载数据。下面显示了已加载的最新数据。随着加载任何其他数据，这些数据将自动更新。
下面显示了用于针对此表执行服务器端处理的脚本。请注意，这只是使用 PHP 的示例脚本。可以使用任何语言编写服务器端处理脚本，利用DataTables 文档中所述的协议。