Bulma 样式

此示例展示了 DataTables 和 RowReorder 扩展,它们与 Bulma 框架一起使用,提供样式。该 DataTables / Bulma 集成 为 DataTables 在 Bulma 页面中的无缝集成提供了支持。

序号 姓名 职位 办公地点 入职日期 薪资
2 Tiger Nixon 系统架构师 爱丁堡 2011-04-25 $320,800
22 Garrett Winters 会计 东京 2011-07-25 $170,750
6 Ashton Cox 初级技术作家 旧金山 2009-01-12 $86,000
41 Cedric Kelly 高级 Javascript 开发者 爱丁堡 2012-03-29 $433,060
55 Airi Satou 会计 东京 2008-11-28 $162,700
21 Brielle Williamson 集成专家 纽约 2012-12-02 $372,000
46 Herrod Chandler 销售助理 旧金山 2012-08-06 $137,500
50 Rhona Davidson 集成专家 东京 2010-10-14 $327,900
26 Colleen Hurst Javascript 开发者 旧金山 2009-09-15 $205,500
18 Sonya Frost 软件工程师 爱丁堡 2008-12-13 $103,600
13 Jena Gaines 办公室经理 伦敦 2008-12-19 $90,560
23 Quinn Flynn 支持主管 爱丁堡 2013-03-03 $342,000
14 Charde Marshall 区域总监 旧金山 2008-10-16 $470,600
12 Haley Kennedy 高级营销设计师 伦敦 2012-12-18 $313,500
54 Tatyana Fitzpatrick 区域总监 伦敦 2010-03-17 $385,750
37 Michael Silva 营销设计师 伦敦 2012-11-27 $198,500
32 Paul Byrd 首席财务官 (CFO) 纽约 2010-06-09 $725,000
35 Gloria Little 系统管理员 纽约 2009-04-10 $237,500
48 Bradley Greer 软件工程师 伦敦 2012-10-13 $132,000
45 Dai Rios 人事主管 爱丁堡 2012-09-26 $217,500
17 Jenette Caldwell 开发主管 纽约 2011-09-03 $345,000
57 Yuri Berry 首席营销官 (CMO) 纽约 2009-06-25 $675,000
29 Caesar Vance 售前支持 纽约 2011-12-12 $106,450
56 Doris Wilder 销售助理 悉尼 2010-09-20 $85,600
36 Angelica Ramos 首席执行官 (CEO) 伦敦 2009-10-09 $1,200,000
5 Gavin Joyce 开发者 爱丁堡 2010-12-22 $92,575
51 Jennifer Chang 区域总监 新加坡 2010-11-14 $357,650
20 Brenden Wagner 软件工程师 旧金山 2011-06-07 $206,850
7 Fiona Green 首席运营官 (COO) 旧金山 2010-03-11 $850,000
1 Shou Itou 区域营销 东京 2011-08-14 $163,000
39 Michelle House 集成专家 悉尼 2011-06-02 $95,400
40 Suki Burks 开发者 伦敦 2009-10-22 $114,500
47 Prescott Bartlett 技术作家 伦敦 2011-05-07 $145,000
52 Gavin Cortez 团队主管 旧金山 2008-10-26 $235,500
8 Martena Mccray 售后支持 爱丁堡 2011-03-09 $324,050
24 Unity Butler 营销设计师 旧金山 2009-12-09 $85,675
38 Howard Hatfield 办公室经理 旧金山 2008-12-16 $164,500
53 Hope Fuentes 秘书 旧金山 2010-02-12 $109,850
30 Vivian Harrell 财务主管 旧金山 2009-02-14 $452,500
28 Timothy Mooney 办公室经理 伦敦 2008-12-11 $136,200
34 Jackson Bradshaw 总监 纽约 2008-09-26 $645,750
4 Olivia Liang 支持工程师 新加坡 2011-02-03 $234,500
3 Bruno Nash 软件工程师 伦敦 2011-05-03 $163,500
31 Sakura Yamamoto 支持工程师 东京 2009-08-19 $139,575
11 Thor Walton 开发者 纽约 2013-08-11 $98,540
10 Finn Camacho 支持工程师 旧金山 2009-07-07 $87,500
44 Serge Baldwin 数据协调员 新加坡 2012-04-09 $138,575
42 Zenaida Frank 软件工程师 纽约 2010-01-04 $125,250
27 Zorita Serrano 软件工程师 旧金山 2012-06-01 $115,000
49 Jennifer Acosta 初级 Javascript 开发者 爱丁堡 2013-02-01 $75,650
15 Cara Stevens 销售助理 纽约 2011-12-06 $145,600
9 Hermione Butler 区域总监 伦敦 2011-03-21 $356,250
25 Lael Greer 系统管理员 伦敦 2009-02-27 $103,500
33 Jonas Alexander 开发者 旧金山 2010-07-14 $86,500
43 Shad Decker 区域总监 爱丁堡 2008-11-13 $183,000
16 Michael Bruce Javascript 开发者 新加坡 2011-06-27 $183,000
19 Donna Snider 客户支持 纽约 2011-01-25 $112,000
序号 姓名 职位 办公地点 入职日期 薪资
  • Javascript
  • HTML
  • CSS
  • Ajax
  • 服务器端脚本
  • 注释

以下 Javascript 代码用于初始化本示例中显示的表格

$('#example').DataTable({ rowReorder: true });
new DataTable('#example', { rowReorder: true });

除了以上代码之外,以下 Javascript 库文件也已加载以供本示例使用

    以下 HTML 代码是原始 HTML 表格元素,在被 DataTables 增强之前

    此示例除了从库文件(以下)加载的内容外,还使用了一点额外的 CSS,以便正确显示表格。以下显示了所使用的额外 CSS

    以下 CSS 库文件已加载以供本示例使用,用于提供表格的样式

      此表格通过 Ajax 加载数据。以下显示了已加载的最新数据。随着加载更多数据,此数据将自动更新。

      以下显示了用于执行此表格的服务器端处理的脚本。请注意,这只是一个使用 PHP 的示例脚本。服务器端处理脚本可以用任何语言编写,使用 DataTables 文档中描述的协议.

      其他示例