表单输入
为了执行分页、排序、搜索等操作，DataTables 可以从文档中移除行和单元格（即没有需要的不插入行/单元格进入文档）。这将提高性能并增强兼容性，但是，这意味着提交跨多页的表单需要一些额外的工作才能获取不再存在于文档中的信息。
无论分页、排序等如何，$() 方法都可以用于从文档中获取节点。此示例展示了 $() 被用来获取表格中的所有 input 元素。举例中，一个简单的 alert() 被用来显示表单中的信息，但使用表单数据对服务器执行一个 Ajax 调用可以轻松实现。
如果您有兴趣为 DataTables 获取一个完整的 CRUD 编辑套件，请参阅 编辑器扩展，它提供简单的设置和与 DataTables 的完整集成。
| 姓名 | 年龄 | 职位 | 办公室 |
|---|---|---|---|
| Tiger Nixon | |||
| Garrett Winters | |||
| Ashton Cox | |||
| Cedric Kelly | |||
| Airi Satou | |||
| Brielle Williamson | |||
| Herrod Chandler | |||
| Rhona Davidson | |||
| Colleen Hurst | |||
| Sonya Frost | |||
| Jena Gaines | |||
| Quinn Flynn | |||
| Charde Marshall | |||
| Haley Kennedy | |||
| Tatyana Fitzpatrick | |||
| Michael Silva | |||
| Paul Byrd | |||
| Gloria Little | |||
| Bradley Greer | |||
| Dai Rios | |||
| Jenette Caldwell | |||
| Yuri Berry | |||
| Caesar Vance | |||
| Doris Wilder | |||
| Angelica Ramos | |||
| Gavin Joyce | |||
| Jennifer Chang | |||
| Brenden Wagner | |||
| Fiona Green | |||
| Shou Itou | |||
| Michelle House | |||
| Suki Burks | |||
| Prescott Bartlett | |||
| Gavin Cortez | |||
| Martena Mccray | |||
| Unity Butler | |||
| Howard Hatfield | |||
| Hope Fuentes | |||
| Vivian Harrell | |||
| Timothy Mooney | |||
| Jackson Bradshaw | |||
| Olivia Liang | |||
| Bruno Nash | |||
| Sakura Yamamoto | |||
| Thor Walton | |||
| Finn Camacho | |||
| Serge Baldwin | |||
| Zenaida Frank | |||
| Zorita Serrano | |||
| Jennifer Acosta | |||
| Cara Stevens | |||
| Hermione Butler | |||
| Lael Greer | |||
| Jonas Alexander | |||
| Shad Decker | |||
| Michael Bruce | |||
| Donna Snider | |||
| 姓名 | 年龄 | 职位 | 办公室 |
- Javascript
- HTML
- CSS
- Ajax
- 服务器端脚本
- 评论
下面所示的 Javascript 用于初始化此示例中显示的表格
var table = $('#example').DataTable({ columnDefs: [ { orderable: false, targets: [1, 2, 3] } ] }); $('#submit').on('click', function (e) { e.preventDefault(); var data = table.$('input, select').serialize(); alert( 'The following data would have been submitted to the server: \n\n' + data.substr(0, 120) + '...' ); });
除上述代码外，还加载了以下 Javascript 库文件以供在此示例中使用
下面所示的 HTML 是原始 HTML 表格元素，在被 DataTables 增强之前
此示例使用了库文件中加载的内容之外的少量附加 CSS（如下），以正确显示表格。使用的是如下所示的附加 CSS
以下 CSS 库文件在此示例中加载，以便为表格提供样式
此表格通过 Ajax 加载数据。已加载的最新数据如下。此数据将随着加载其他数据而自动更新。
用于对此表格执行服务端处理的脚本如下所示。请注意，这只是一个使用 PHP 的示例脚本。服务端处理脚本可以用任何语言编写，使用DataTables 文档中描述的协议。