使用 Luxon 格式化日期
此示例包含多种非标准格式的日期，以演示 SearchBuilder 如何处理格式化的日期。它使用 DataTables 内置的 datetime() 函数，使用 Moment.js 或 Luxon 格式化日期，具体取决于页面上可用的是哪个（在本例中是 Luxon）。
| 姓名 | 公司 | 创建日期 | 更新日期 |
|---|---|---|---|
| Dai Weeks | Eu Foundation | 11:10 十月 18, 14 | 星期六, 5 月 16, 2015 |
| Jade Dale | Sit Amet Inc. | 07:04 四月 29, 14 | 星期六, 七月 25, 2015 |
| Melanie Buckner | Tempus Lorem LLC | 02:01 一月 28, 15 | 星期日, 十月 11, 2015 |
| Cyrus Haney | Phasellus Corp. | 10:01 一月 28, 14 | 星期六, 十二月 28, 2013 |
| Melinda Salas | Molestie Sed Id Limited | 11:05 五月 1, 14 | 星期五, 五月 15, 2015 |
| Rebecca Cline | Eget Dictum Placerat Limited | 02:12 十二月 20, 13 | 星期三, 八月 6, 2014 |
| India Lawson | Eget Company | 11:03 三月 21, 15 | 星期五, 七月 11, 2014 |
| Elvis Whitfield | Mollis Corporation | 08:07 七月 30, 15 | 星期六, 二月 28, 2015 |
| Castor Monroe | Iaculis LLC | 12:06 六月 22, 14 | 星期一, 六月 2, 2014 |
| Gareth Berry | Malesuada Corp. | 04:02 二月 26, 14 | 星期五, 二月 27, 2015 |
| Anne Knox | Neque Sed Consulting | 04:04 四月 11, 14 | 星期六, 五月 24, 2014 |
| Kasimir Martin | Tortor Nunc Consulting | 11:12 十二月 24, 14 | 星期六, 七月 25, 2015 |
| Drake Pugh | Mattis Velit Industries | 03:09 九月 23, 15 | 星期三, 三月 5, 2014 |
| Carla Head | Pretium Aliquet Institute | 06:09 九月 2, 15 | 星期三, 一月 8, 2014 |
| Shellie Henry | Scelerisque Ltd | 11:01 一月 28, 15 | 星期日, 二月 1, 2015 |
| Patrick Koch | Scelerisque Dui LLC | 10:10 十月 3, 14 | 星期日, 五月 17, 2015 |
| Dara Roberts | Urna Convallis Erat Industries | 11:08 八月 13, 15 | 星期日, 六月 22, 2014 |
| Yuli Wright | Auctor Consulting | 05:07 七月 22, 14 | 星期二, 三月 25, 2014 |
| Cyrus Jensen | Et Risus Associates | 10:09 九月 19, 15 | 星期六, 5 月 16, 2015 |
| Holmes Talley | Urna Nullam Lobortis Consulting | 01:12 十二月 25, 14 | 星期四, 二月 13, 2014 |
| Iris Carver | Laoreet Lectus Quis LLC | 12:10 十月 13, 14 | 星期五, 十一月 7, 2014 |
| Leroy Cantrell | In LLC | 03:05 五月 5, 15 | 星期二, 六月 2, 2015 |
| Maggie Aguilar | Mauris PC | 02:12 十二月 7, 14 | 星期四, 十一月 20, 2014 |
| Maggy Porter | Mauris Blandit Ltd | 11:06 六月 4, 14 | 星期二, 十一月 11, 2014 |
| Liberty Warner | Ipsum Company | 05:11 十一月 17, 15 | 星期一, 十月 5, 2015 |
| Raya Dean | Felis Foundation | 02:12 十二月 18, 14 | 星期一, 二月 10, 2014 |
| Jack Juarez | Nunc Limited | 01:09 九月 7, 15 | 星期一, 十二月 22, 2014 |
| Nola King | Varius Orci Incorporated | 04:05 五月 12, 15 | 星期二, 六月 24, 2014 |
| Carlos Holman | Odio LLC | 01:08 八月 16, 15 | 星期四, 八月 20, 2015 |
| Aquila Finch | Egestas Ligula Nullam Institute | 12:09 九月 3, 15 | 星期六, 三月 22, 2014 |
| Seth Porter | Sem Ut Inc. | 01:06 六月 4, 15 | 星期日, 三月 1, 2015 |
| Oleg Mcpherson | Nunc Ac Sem LLP | 03:08 八月 3, 14 | 星期日, 九月 21, 2014 |
| Kennan Snyder | Amet Consectetuer Associates | 06:01 一月 23, 14 | 星期一, 四月 7, 2014 |
| Emery Donovan | Dapibus Inc. | 08:06 六月 14, 14 | 星期二, 九月 30, 2014 |
| Naida Hunter | Augue Scelerisque Mollis Inc. | 11:12 十二月 23, 13 | 星期日, 七月 19, 2015 |
| Clinton Morrison | Non Lacinia Industries | 02:03 三月 18, 14 | 星期五, 三月 6, 2015 |
| Helen Gutierrez | Faucibus Incorporated | 07:08 八月 7, 15 | 星期二, 二月 4, 2014 |
| Candice Bonner | Donec LLP | 05:12 十二月 28, 13 | 星期一, 三月 16, 2015 |
| Nissim Carter | Suspendisse Sed Limited | 01:03 三月 19, 14 | 星期一, 六月 29, 2015 |
| Kasimir Hoffman | Id Libero Donec Consulting | 05:12 十二月 23, 14 | 星期三, 九月 23, 2015 |
| Imogene Mcconnell | Vitae Associates | 07:02 二月 17, 15 | 星期二, 七月 22, 2014 |
| Sage Mosley | Metus In Inc. | 05:05 五月 24, 15 | 星期一, 四月 21, 2014 |
| Sybil Puckett | Vel Lectus LLP | 09:06 六月 9, 14 | 星期六, 九月 6, 2014 |
| Kylynn Solis | Ac Limited | 10:01 一月 20, 15 | 星期二, 九月 15, 2015 |
| Beatrice Hurley | Mauris A Nunc Corporation | 04:05 五月 11, 14 | 星期日, 四月 26, 2015 |
| Troy Marquez | Dapibus Quam Institute | 12:02 二月 7, 15 | 星期四, 四月 23, 2015 |
| Malcolm Payne | Adipiscing Ligula Institute | 04:08 八月 17, 15 | 星期二, 九月 2, 2014 |
| Wade Valenzuela | Sagittis Duis Gravida Corporation | 03:05 五月 22, 14 | 星期一, 一月 13, 2014 |
| Kathleen Gilmore | Urna Nec Ltd | 05:03 三月 5, 14 | 星期一, 十一月 16, 2015 |
| Maite Scott | Ipsum Cursus Inc. | 01:05 五月 28, 14 | 星期日, 六月 8, 2014 |
| Kamal Nash | Sem Vitae Company | 05:10 十月 7, 14 | 星期四, 六月 26, 2014 |
| Iliana West | Ac Eleifend Limited | 01:10 十月 24, 15 | 星期三, 七月 2, 2014 |
| Susan Osborn | Sollicitudin Adipiscing Ligula Institute | 03:02 二月 18, 14 | 星期六, 六月 13, 2015 |
| Adena Carter | Nibh Industries | 04:01 一月 27, 15 | 星期二, 二月 3, 2015 |
| Duncan Mckinney | Vel Convallis In Inc. | 09:11 十一月 23, 15 | 星期六, 十二月 12, 2015 |
| Ariana Whitehead | Fermentum Metus Associates | 03:06 六月 9, 14 | 星期二, 十二月 15, 2015 |
| Fiona Henderson | Eget Tincidunt Dui Inc. | 03:01 一月 1, 14 | 星期五, 一月 9, 2015 |
| Judah Gates | Donec Felis Associates | 04:11 十一月 30, 15 | 星期一, 九月 28, 2015 |
| Hasad Mccarthy | Ac Tellus Company | 12:01 一月 21, 14 | 星期一, 一月 27, 2014 |
| Shay Valencia | Natoque Associates | 05:03 三月 4, 14 | 星期一, 十二月 15, 2014 |
| Hillary Tran | Integer Mollis Foundation | 08:12 十二月 31, 14 | 星期三, 八月 26, 2015 |
| Margaret Sellers | Lacus Quisque Corporation | 11:10 十月 17, 15 | 星期日, 七月 5, 2015 |
| Prescott Morton | Vestibulum Associates | 01:04 四月 27, 15 | 星期日, 六月 14, 2015 |
| Charity Gilbert | Tortor At Risus Associates | 01:07 七月 31, 14 | 星期四, 十二月 18, 2014 |
| Freya Randolph | Ut Institute | 07:11 十一月 3, 15 | 星期六, 九月 27, 2014 |
| Nita Howe | Ornare Fusce Inc. | 11:02 二月 12, 14 | 星期二, 六月 9, 2015 |
| Kirby Whitney | Faucibus Morbi Vehicula Foundation | 11:12 十二月 22, 13 | 星期三, 八月 26, 2015 |
| Amos Jarvis | Mauris Suspendisse Aliquet LLP | 01:05 五月 10, 15 | 星期一, 七月 14, 2014 |
| Kim Hunter | Ligula Donec Luctus Corp. | 07:11 十一月 25, 15 | 星期四, 十月 23, 2014 |
| Rosalyn Benton | Iaculis Quis Pede Corp. | 02:09 九月 16, 14 | 星期日, 十一月 15, 2015 |
| Anjolie Floyd | Nunc Corp. | 12:03 三月 28, 14 | 星期一, 十二月 1, 2014 |
| Basil Harmon | Semper Rutrum Fusce PC | 05:12 十二月 9, 15 | 星期三, 九月 17, 2014 |
| Kermit Herrera | Sed Tortor Integer Limited | 03:09 九月 26, 14 | 星期日, 六月 14, 2015 |
| Winifred Pearson | Augue Industries | 10:09 九月 18, 15 | 星期二, 八月 4, 2015 |
| Lester Fischer | Aenean PC | 02:09 九月 15, 15 | 星期三, 七月 29, 2015 |
| Tatum Daugherty | Nunc Nulla LLP | 09:06 六月 25, 15 | 星期三, 二月 19, 2014 |
| Zachary Wilder | Nec LLC | 03:09 九月 19, 14 | 星期三, 四月 8, 2015 |
| Laith Peters | Ipsum Leo Elementum Institute | 11:06 六月 17, 14 | 星期四, 十一月 13, 2014 |
| Evelyn Ramos | Nunc Industries | 01:06 六月 3, 14 | 星期四, 四月 10, 2014 |
| Mara Michael | Ut Aliquam LLC | 10:07 七月 14, 14 | 星期四, 十一月 26, 2015 |
| Jemima Powers | Eu Arcu Morbi LLP | 06:08 八月 4, 14 | 星期五, 五月 1, 2015 |
| Tanek Guthrie | Sit Associates | 09:02 二月 19, 15 | 星期四, 五月 28, 2015 |
| Harriet Crane | Quis Accumsan 有限公司 | 14 年 8 月 2 日 12:08 | 2015 年 12 月 13 日星期日 |
| 金邦 | Auctor Quis 公司 | 15 年 8 月 25 日 09:08 | 2014 年 11 月 18 日星期二 |
| Ursa Jacobs | Convallis Ante 个人电脑 | 14 年 4 月 5 日 08:04 | 2014 年 2 月 18 日星期二 |
| Jason Collier | Vel Pede Blandit 有限公司 | 14 年 5 月 12 日 01:05 | 2015 年 9 月 21 日星期一 |
| Quemby Stone | Lacus Quisque 公司 | 15 年 8 月 10 日 09:08 | 2015 年 7 月 2 日星期四 |
| Melvin Sweet | Nec 基金会 | 15 年 1 月 17 日 05:01 | 2014 年 5 月 22 日星期四 |
| Thor Wilson | Arcu Vivamus Sit 工业 | 15 年 2 月 17 日 02:02 | 2014 年 8 月 7 日星期四 |
| Burton Marquez | Augue 公司 | 15 年 12 月 2 日 09:12 | 2014 年 11 月 26 日星期三 |
| Kai Ware | Facilisis Vitae 有限公司 | 14 年 6 月 23 日 12:06 | 2014 年 6 月 29 日星期日 |
| Holmes Murphy | Dui Nec Tempus 公司 | 15 年 10 月 25 日 12:10 | 星期日, 四月 26, 2015 |
| Blaine Valentine | Proin 研究所 | 14 年 10 月 16 日 04:10 | 2015 年 3 月 30 日星期一 |
| Lionel Pacheco | Dolor 公司 | 14 年 3 月 18 日 07:03 | 星期六, 五月 24, 2014 |
| Keefe Fletcher | A Mi Fringilla 工业 | 15 年 9 月 25 日 03:09 | 2015 年 10 月 22 日星期四 |
| Slade Rojas | Sodales Nisi Magna 个人电脑 | 15 年 9 月 1 日 08:09 | 2014 年 6 月 11 日星期三 |
| Vanna Kirkland | Tempus 公司 | 15 年 2 月 14 日 03:02 | 2015 年 12 月 9 日星期三 |
| Cameron Peters | Lobortis Tellus Justo 有限公司 | 15 年 2 月 9 日 06:02 | 2015 年 1 月 2 日星期五 |
| Reed Freeman | Augue Sed Molestie 合伙企业 | 15 年 9 月 24 日 01:09 | 星期日, 七月 19, 2015 |
| Florence Burgess | Aliquam Auctor Velit 公司 | 14 年 4 月 20 日 05:04 | 2014 年 9 月 8 日星期一 |
- Javascript
- HTML
- CSS
- Ajax
- 服务器端脚本
- 注释
下面显示的 Javascript 用于初始化本示例中显示的表格
DataTable.datetime('EEE, MMMM d, yyyy'); DataTable.datetime('HH:mm MMM d, yy'); $('#example').DataTable({ layout: { topStart: 'searchBuilder' } });
DataTable.datetime('EEE, MMMM d, yyyy'); DataTable.datetime('HH:mm MMM d, yy'); new DataTable('#example', { layout: { topStart: 'searchBuilder' } });
除了上面的代码之外，以下 Javascript 库文件也加载到本示例中使用
下面显示的 HTML 是原始 HTML 表格元素，在被 DataTables 增强之前
本示例使用了一些超出库文件（如下）加载的 CSS，以便正确显示表格。使用的附加 CSS 如下所示
以下 CSS 库文件加载到本示例中使用，以提供表格的样式
此表格通过 Ajax 加载数据。加载的最新数据显示如下。此数据将在加载任何其他数据时自动更新。
用于执行此表格的服务器端处理的脚本显示如下。请注意，这只是一个使用 PHP 的示例脚本。服务器端处理脚本可以使用任何语言编写，使用 DataTables 文档中描述的协议。