選擇器儲存格樣式

RowReorder 樣式表提供了一個 reorder 類別，可以應用於將開始行重新排序的列（使用 columns.className 選項完成），向最終用戶提供視覺指示，表明這是一個拖曳控制柄（一個移動游標）。

此範例顯示在表格第一欄的實際應用。

序號	姓名	職位	辦公室	開始日期	薪資
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({ columnDefs: [ { orderable: true, className: 'reorder', targets: 0 }, { orderable: false, targets: '_all' } ], rowReorder: true });

new DataTable('#example', { columnDefs: [ { orderable: true, className: 'reorder', targets: 0 }, { orderable: false, targets: '_all' } ], rowReorder: true });

除了上面的程式碼之外，還載入了以下 Javascript 程式庫檔案以在此範例中使用

以下顯示的 HTML 是原始 HTML 表格元素，在被 DataTables 增強之前

此範例除了從程式庫檔案（如下所示）載入的 CSS 之外，還使用了一些額外的 CSS，以便正確顯示表格。使用的額外 CSS 如下所示

載入以下 CSS 程式庫檔案以在此範例中使用，以提供表格的樣式

此表格透過 Ajax 載入資料。以下顯示已載入的最新資料。隨著載入任何額外的資料，此資料將自動更新。

以下顯示用於此表格執行伺服器端處理的腳本。請注意，這只是一個使用 PHP 的範例腳本。伺服器端處理腳本可以使用任何語言編寫，使用 DataTables 文件中描述的協議。

選擇器儲存格樣式

其他範例

初始化

樣式

DataTables