- var datatable = true;
- var datatable_extension = true;
- var theme_customizer = true;
- var tooltip = true;
doctype html
html(lang='en')
include ../../components/header-files
body
include ../../components/loader
// page-wrapper Start
#pageWrapper.page-wrapper
include ../../components/header
// Page Body Start
.page-body-wrapper.horizontal-menu
include ../../components/sidebar
.page-body
.container-fluid
.page-header
.row
.col-sm-6
h3
| Rows Reorder
ol.breadcrumb
li.breadcrumb-item
a(href='index.html')
| Home
li.breadcrumb-item Tables
li.breadcrumb-item Extension Data Tables
li.breadcrumb-item.active Rows Reorder
.col-sm-6
include ../../components/bookmark
// Container-fluid starts
.container-fluid
.row
.col-sm-12
.card
.card-header
h5 Basic Row Reorder
span
| This trivial example shows the use of the rowReorder property being used to enable RowReorder on a DataTable. The first column in the table is a sequence number that provides the basis for the ordering. To change a row's order, simply click the first column and drag the row. Note that ordering is enabled on all columns in this example.
.card-body
.dt-ext.table-responsive
table#basic-row-reorder.display
thead
tr
th Name
th Position
th Office
th Age
th Start date
th Salary
tbody
tr
td Tiger Nixon
td System Architect
td Edinburgh
td 61
td 2011/04/25
td $320,800
tr
td Garrett Winters
td Accountant
td Tokyo
td 63
td 2011/07/25
td $170,750
tr
td Ashton Cox
td Junior Technical Author
td San Francisco
td 66
td 2009/01/12
td $86,000
tr
td Cedric Kelly
td Senior Javascript Developer
td Edinburgh
td 22
td 2012/03/29
td $433,060
tr
td Airi Satou
td Accountant
td Tokyo
td 33
td 2008/11/28
td $162,700
tr
td Brielle Williamson
td Integration Specialist
td New York
td 61
td 2012/12/02
td $372,000
tr
td Herrod Chandler
td Sales Assistant
td San Francisco
td 59
td 2012/08/06
td $137,500
tr
td Rhona Davidson
td Integration Specialist
td Tokyo
td 55
td 2010/10/14
td $327,900
tr
td Colleen Hurst
td Javascript Developer
td San Francisco
td 39
td 2009/09/15
td $205,500
tr
td Sonya Frost
td Software Engineer
td Edinburgh
td 23
td 2008/12/13
td $103,600
tr
td Jena Gaines
td Office Manager
td London
td 30
td 2008/12/19
td $90,560
tr
td Quinn Flynn
td Support Lead
td Edinburgh
td 22
td 2013/03/03
td $342,000
tr
td Charde Marshall
td Regional Director
td San Francisco
td 36
td 2008/10/16
td $470,600
tr
td Haley Kennedy
td Senior Marketing Designer
td London
td 43
td 2012/12/18
td $313,500
tr
td Tatyana Fitzpatrick
td Regional Director
td London
td 19
td 2010/03/17
td $385,750
tr
td Michael Silva
td Marketing Designer
td London
td 66
td 2012/11/27
td $198,500
tr
td Paul Byrd
td Chief Financial Officer (CFO)
td New York
td 64
td 2010/06/09
td $725,000
tr
td Gloria Little
td Systems Administrator
td New York
td 59
td 2009/04/10
td $237,500
tr
td Bradley Greer
td Software Engineer
td London
td 41
td 2012/10/13
td $132,000
tr
td Dai Rios
td Personnel Lead
td Edinburgh
td 35
td 2012/09/26
td $217,500
tr
td Jenette Caldwell
td Development Lead
td New York
td 30
td 2011/09/03
td $345,000
tr
td Yuri Berry
td Chief Marketing Officer (CMO)
td New York
td 40
td 2009/06/25
td $675,000
tr
td Caesar Vance
td Pre-Sales Support
td New York
td 21
td 2011/12/12
td $106,450
tr
td Doris Wilder
td Sales Assistant
td Sidney
td 23
td 2010/09/20
td $85,600
tr
td Angelica Ramos
td Chief Executive Officer (CEO)
td London
td 47
td 2009/10/09
td $1,200,000
tr
td Gavin Joyce
td Developer
td Edinburgh
td 42
td 2010/12/22
td $92,575
tr
td Jennifer Chang
td Regional Director
td Singapore
td 28
td 2010/11/14
td $357,650
tr
td Brenden Wagner
td Software Engineer
td San Francisco
td 28
td 2011/06/07
td $206,850
tr
td Fiona Green
td Chief Operating Officer (COO)
td San Francisco
td 48
td 2010/03/11
td $850,000
tr
td Shou Itou
td Regional Marketing
td Tokyo
td 20
td 2011/08/14
td $163,000
tr
td Michelle House
td Integration Specialist
td Sidney
td 37
td 2011/06/02
td $95,400
tr
td Suki Burks
td Developer
td London
td 53
td 2009/10/22
td $114,500
tr
td Prescott Bartlett
td Technical Author
td London
td 27
td 2011/05/07
td $145,000
tr
td Gavin Cortez
td Team Leader
td San Francisco
td 22
td 2008/10/26
td $235,500
tr
td Martena Mccray
td Post-Sales support
td Edinburgh
td 46
td 2011/03/09
td $324,050
tr
td Unity Butler
td Marketing Designer
td San Francisco
td 47
td 2009/12/09
td $85,675
tr
td Howard Hatfield
td Office Manager
td San Francisco
td 51
td 2008/12/16
td $164,500
tr
td Hope Fuentes
td Secretary
td San Francisco
td 41
td 2010/02/12
td $109,850
tr
td Vivian Harrell
td Financial Controller
td San Francisco
td 62
td 2009/02/14
td $452,500
tr
td Timothy Mooney
td Office Manager
td London
td 37
td 2008/12/11
td $136,200
tr
td Jackson Bradshaw
td Director
td New York
td 65
td 2008/09/26
td $645,750
tr
td Olivia Liang
td Support Engineer
td Singapore
td 64
td 2011/02/03
td $234,500
tr
td Bruno Nash
td Software Engineer
td London
td 38
td 2011/05/03
td $163,500
tr
td Sakura Yamamoto
td Support Engineer
td Tokyo
td 37
td 2009/08/19
td $139,575
tr
td Thor Walton
td Developer
td New York
td 61
td 2013/08/11
td $98,540
tr
td Finn Camacho
td Support Engineer
td San Francisco
td 47
td 2009/07/07
td $87,500
tr
td Serge Baldwin
td Data Coordinator
td Singapore
td 64
td 2012/04/09
td $138,575
tr
td Zenaida Frank
td Software Engineer
td New York
td 63
td 2010/01/04
td $125,250
tr
td Zorita Serrano
td Software Engineer
td San Francisco
td 56
td 2012/06/01
td $115,000
tr
td Jennifer Acosta
td Junior Javascript Developer
td Edinburgh
td 43
td 2013/02/01
td $75,650
tr
td Cara Stevens
td Sales Assistant
td New York
td 46
td 2011/12/06
td $145,600
tr
td Hermione Butler
td Regional Director
td London
td 47
td 2011/03/21
td $356,250
tr
td Lael Greer
td Systems Administrator
td London
td 21
td 2009/02/27
td $103,500
tr
td Jonas Alexander
td Developer
td San Francisco
td 30
td 2010/07/14
td $86,500
tr
td Shad Decker
td Regional Director
td Edinburgh
td 51
td 2008/11/13
td $183,000
tr
td Michael Bruce
td Javascript Developer
td Singapore
td 29
td 2011/06/27
td $183,000
tr
td Donna Snider
td Customer Support
td New York
td 27
td 2011/01/25
td $112,000
tfoot
tr
th Name
th Position
th Office
th Age
th Start date
th Salary
.col-sm-12
.card
.card-header
h5 Full row selection
span
| The rowReorder.selector option provides the ability to define which element in a table row will provide the row reordering handle to the end user. By default only the first cell in the row will trigger the reordering action. This example shows the entire row being able to start the reorder. Simply click and drag anywhere on the row. Additionally, the column that defines the row order is hidden by default, making the table a simple orderable list.
.card-body
.dt-ext.table-responsive
table#full-row.display
thead
tr
th Name
th Position
th Office
th Age
th Start date
th Salary
tbody
tr
td Tiger Nixon
td System Architect
td Edinburgh
td 61
td 2011/04/25
td $320,800
tr
td Garrett Winters
td Accountant
td Tokyo
td 63
td 2011/07/25
td $170,750
tr
td Ashton Cox
td Junior Technical Author
td San Francisco
td 66
td 2009/01/12
td $86,000
tr
td Cedric Kelly
td Senior Javascript Developer
td Edinburgh
td 22
td 2012/03/29
td $433,060
tr
td Airi Satou
td Accountant
td Tokyo
td 33
td 2008/11/28
td $162,700
tr
td Brielle Williamson
td Integration Specialist
td New York
td 61
td 2012/12/02
td $372,000
tr
td Herrod Chandler
td Sales Assistant
td San Francisco
td 59
td 2012/08/06
td $137,500
tr
td Rhona Davidson
td Integration Specialist
td Tokyo
td 55
td 2010/10/14
td $327,900
tr
td Colleen Hurst
td Javascript Developer
td San Francisco
td 39
td 2009/09/15
td $205,500
tr
td Sonya Frost
td Software Engineer
td Edinburgh
td 23
td 2008/12/13
td $103,600
tr
td Jena Gaines
td Office Manager
td London
td 30
td 2008/12/19
td $90,560
tr
td Quinn Flynn
td Support Lead
td Edinburgh
td 22
td 2013/03/03
td $342,000
tr
td Charde Marshall
td Regional Director
td San Francisco
td 36
td 2008/10/16
td $470,600
tr
td Haley Kennedy
td Senior Marketing Designer
td London
td 43
td 2012/12/18
td $313,500
tr
td Tatyana Fitzpatrick
td Regional Director
td London
td 19
td 2010/03/17
td $385,750
tr
td Michael Silva
td Marketing Designer
td London
td 66
td 2012/11/27
td $198,500
tr
td Paul Byrd
td Chief Financial Officer (CFO)
td New York
td 64
td 2010/06/09
td $725,000
tr
td Gloria Little
td Systems Administrator
td New York
td 59
td 2009/04/10
td $237,500
tr
td Bradley Greer
td Software Engineer
td London
td 41
td 2012/10/13
td $132,000
tr
td Dai Rios
td Personnel Lead
td Edinburgh
td 35
td 2012/09/26
td $217,500
tr
td Jenette Caldwell
td Development Lead
td New York
td 30
td 2011/09/03
td $345,000
tr
td Yuri Berry
td Chief Marketing Officer (CMO)
td New York
td 40
td 2009/06/25
td $675,000
tr
td Caesar Vance
td Pre-Sales Support
td New York
td 21
td 2011/12/12
td $106,450
tr
td Doris Wilder
td Sales Assistant
td Sidney
td 23
td 2010/09/20
td $85,600
tr
td Angelica Ramos
td Chief Executive Officer (CEO)
td London
td 47
td 2009/10/09
td $1,200,000
tr
td Gavin Joyce
td Developer
td Edinburgh
td 42
td 2010/12/22
td $92,575
tr
td Jennifer Chang
td Regional Director
td Singapore
td 28
td 2010/11/14
td $357,650
tr
td Brenden Wagner
td Software Engineer
td San Francisco
td 28
td 2011/06/07
td $206,850
tr
td Fiona Green
td Chief Operating Officer (COO)
td San Francisco
td 48
td 2010/03/11
td $850,000
tr
td Shou Itou
td Regional Marketing
td Tokyo
td 20
td 2011/08/14
td $163,000
tr
td Michelle House
td Integration Specialist
td Sidney
td 37
td 2011/06/02
td $95,400
tr
td Suki Burks
td Developer
td London
td 53
td 2009/10/22
td $114,500
tr
td Prescott Bartlett
td Technical Author
td London
td 27
td 2011/05/07
td $145,000
tr
td Gavin Cortez
td Team Leader
td San Francisco
td 22
td 2008/10/26
td $235,500
tr
td Martena Mccray
td Post-Sales support
td Edinburgh
td 46
td 2011/03/09
td $324,050
tr
td Unity Butler
td Marketing Designer
td San Francisco
td 47
td 2009/12/09
td $85,675
tr
td Howard Hatfield
td Office Manager
td San Francisco
td 51
td 2008/12/16
td $164,500
tr
td Hope Fuentes
td Secretary
td San Francisco
td 41
td 2010/02/12
td $109,850
tr
td Vivian Harrell
td Financial Controller
td San Francisco
td 62
td 2009/02/14
td $452,500
tr
td Timothy Mooney
td Office Manager
td London
td 37
td 2008/12/11
td $136,200
tr
td Jackson Bradshaw
td Director
td New York
td 65
td 2008/09/26
td $645,750
tr
td Olivia Liang
td Support Engineer
td Singapore
td 64
td 2011/02/03
td $234,500
tr
td Bruno Nash
td Software Engineer
td London
td 38
td 2011/05/03
td $163,500
tr
td Sakura Yamamoto
td Support Engineer
td Tokyo
td 37
td 2009/08/19
td $139,575
tr
td Thor Walton
td Developer
td New York
td 61
td 2013/08/11
td $98,540
tr
td Finn Camacho
td Support Engineer
td San Francisco
td 47
td 2009/07/07
td $87,500
tr
td Serge Baldwin
td Data Coordinator
td Singapore
td 64
td 2012/04/09
td $138,575
tr
td Zenaida Frank
td Software Engineer
td New York
td 63
td 2010/01/04
td $125,250
tr
td Zorita Serrano
td Software Engineer
td San Francisco
td 56
td 2012/06/01
td $115,000
tr
td Jennifer Acosta
td Junior Javascript Developer
td Edinburgh
td 43
td 2013/02/01
td $75,650
tr
td Cara Stevens
td Sales Assistant
td New York
td 46
td 2011/12/06
td $145,600
tr
td Hermione Butler
td Regional Director
td London
td 47
td 2011/03/21
td $356,250
tr
td Lael Greer
td Systems Administrator
td London
td 21
td 2009/02/27
td $103,500
tr
td Jonas Alexander
td Developer
td San Francisco
td 30
td 2010/07/14
td $86,500
tr
td Shad Decker
td Regional Director
td Edinburgh
td 51
td 2008/11/13
td $183,000
tr
td Michael Bruce
td Javascript Developer
td Singapore
td 29
td 2011/06/27
td $183,000
tr
td Donna Snider
td Customer Support
td New York
td 27
td 2011/01/25
td $112,000
tfoot
tr
th Name
th Position
th Office
th Age
th Start date
th Salary
.col-sm-12
.card
.card-header
h5 Restricted column ordering
span
| This example shows that RowReorder will be used in, as ordering by other columns can make the reordering potentially quite confusing for the end user.
.card-body
.dt-ext.table-responsive
table#rest-column.display
thead
tr
th First name
th Last name
th Position
th Office
th Age
th Start date
th Salary
th Extn.
th E-mail
tbody
tr
td Tiger
td Nixon
td System Architect
td Edinburgh
td 61
td 2011/04/25
td $320,800
td 5421
td [email protected]
tr
td Garrett
td Winters
td Accountant
td Tokyo
td 63
td 2011/07/25
td $170,750
td 8422
td [email protected]
tr
td Ashton
td Cox
td Junior Technical Author
td San Francisco
td 66
td 2009/01/12
td $86,000
td 1562
td [email protected]
tr
td Cedric
td Kelly
td Senior Javascript Developer
td Edinburgh
td 22
td 2012/03/29
td $433,060
td 6224
td [email protected]
tr
td Airi
td Satou
td Accountant
td Tokyo
td 33
td 2008/11/28
td $162,700
td 5407
td [email protected]
tr
td Brielle
td Williamson
td Integration Specialist
td New York
td 61
td 2012/12/02
td $372,000
td 4804
td [email protected]
tr
td Herrod
td Chandler
td Sales Assistant
td San Francisco
td 59
td 2012/08/06
td $137,500
td 9608
td [email protected]
tr
td Rhona
td Davidson
td Integration Specialist
td Tokyo
td 55
td 2010/10/14
td $327,900
td 6200
td [email protected]
tr
td Colleen
td Hurst
td Javascript Developer
td San Francisco
td 39
td 2009/09/15
td $205,500
td 2360
td [email protected]
tr
td Sonya
td Frost
td Software Engineer
td Edinburgh
td 23
td 2008/12/13
td $103,600
td 1667
td [email protected]
tr
td Jena
td Gaines
td Office Manager
td London
td 30
td 2008/12/19
td $90,560
td 3814
td [email protected]
tr
td Quinn
td Flynn
td Support Lead
td Edinburgh
td 22
td 2013/03/03
td $342,000
td 9497
td [email protected]
tr
td Charde
td Marshall
td Regional Director
td San Francisco
td 36
td 2008/10/16
td $470,600
td 6741
td [email protected]
tr
td Haley
td Kennedy
td Senior Marketing Designer
td London
td 43
td 2012/12/18
td $313,500
td 3597
td [email protected]
tr
td Tatyana
td Fitzpatrick
td Regional Director
td London
td 19
td 2010/03/17
td $385,750
td 1965
td [email protected]
tr
td Michael
td Silva
td Marketing Designer
td London
td 66
td 2012/11/27
td $198,500
td 1581
td [email protected]
tr
td Paul
td Byrd
td Chief Financial Officer (CFO)
td New York
td 64
td 2010/06/09
td $725,000
td 3059
td [email protected]
tr
td Gloria
td Little
td Systems Administrator
td New York
td 59
td 2009/04/10
td $237,500
td 1721
td [email protected]
tr
td Bradley
td Greer
td Software Engineer
td London
td 41
td 2012/10/13
td $132,000
td 2558
td [email protected]
tr
td Dai
td Rios
td Personnel Lead
td Edinburgh
td 35
td 2012/09/26
td $217,500
td 2290
td [email protected]
tr
td Jenette
td Caldwell
td Development Lead
td New York
td 30
td 2011/09/03
td $345,000
td 1937
td [email protected]
tr
td Yuri
td Berry
td Chief Marketing Officer (CMO)
td New York
td 40
td 2009/06/25
td $675,000
td 6154
td [email protected]
tr
td Caesar
td Vance
td Pre-Sales Support
td New York
td 21
td 2011/12/12
td $106,450
td 8330
td [email protected]
tr
td Doris
td Wilder
td Sales Assistant
td Sidney
td 23
td 2010/09/20
td $85,600
td 3023
td [email protected]
tr
td Angelica
td Ramos
td Chief Executive Officer (CEO)
td London
td 47
td 2009/10/09
td $1,200,000
td 5797
td [email protected]
tr
td Gavin
td Joyce
td Developer
td Edinburgh
td 42
td 2010/12/22
td $92,575
td 8822
td [email protected]
tr
td Jennifer
td Chang
td Regional Director
td Singapore
td 28
td 2010/11/14
td $357,650
td 9239
td [email protected]
tr
td Brenden
td Wagner
td Software Engineer
td San Francisco
td 28
td 2011/06/07
td $206,850
td 1314
td [email protected]
tr
td Fiona
td Green
td Chief Operating Officer (COO)
td San Francisco
td 48
td 2010/03/11
td $850,000
td 2947
td [email protected]
tr
td Shou
td Itou
td Regional Marketing
td Tokyo
td 20
td 2011/08/14
td $163,000
td 8899
td [email protected]
tr
td Michelle
td House
td Integration Specialist
td Sidney
td 37
td 2011/06/02
td $95,400
td 2769
td [email protected]
tr
td Suki
td Burks
td Developer
td London
td 53
td 2009/10/22
td $114,500
td 6832
td [email protected]
tr
td Prescott
td Bartlett
td Technical Author
td London
td 27
td 2011/05/07
td $145,000
td 3606
td [email protected]
tr
td Gavin
td Cortez
td Team Leader
td San Francisco
td 22
td 2008/10/26
td $235,500
td 2860
td [email protected]
tr
td Martena
td Mccray
td Post-Sales support
td Edinburgh
td 46
td 2011/03/09
td $324,050
td 8240
td [email protected]
tr
td Unity
td Butler
td Marketing Designer
td San Francisco
td 47
td 2009/12/09
td $85,675
td 5384
td [email protected]
tr
td Howard
td Hatfield
td Office Manager
td San Francisco
td 51
td 2008/12/16
td $164,500
td 7031
td [email protected]
tr
td Hope
td Fuentes
td Secretary
td San Francisco
td 41
td 2010/02/12
td $109,850
td 6318
td [email protected]
tr
td Vivian
td Harrell
td Financial Controller
td San Francisco
td 62
td 2009/02/14
td $452,500
td 9422
td [email protected]
tr
td Timothy
td Mooney
td Office Manager
td London
td 37
td 2008/12/11
td $136,200
td 7580
td [email protected]
tr
td Jackson
td Bradshaw
td Director
td New York
td 65
td 2008/09/26
td $645,750
td 1042
td [email protected]
tr
td Olivia
td Liang
td Support Engineer
td Singapore
td 64
td 2011/02/03
td $234,500
td 2120
td [email protected]
tr
td Bruno
td Nash
td Software Engineer
td London
td 38
td 2011/05/03
td $163,500
td 6222
td [email protected]
tr
td Sakura
td Yamamoto
td Support Engineer
td Tokyo
td 37
td 2009/08/19
td $139,575
td 9383
td [email protected]
tr
td Thor
td Walton
td Developer
td New York
td 61
td 2013/08/11
td $98,540
td 8327
td [email protected]
tr
td Finn
td Camacho
td Support Engineer
td San Francisco
td 47
td 2009/07/07
td $87,500
td 2927
td [email protected]
tr
td Serge
td Baldwin
td Data Coordinator
td Singapore
td 64
td 2012/04/09
td $138,575
td 8352
td [email protected]
tr
td Zenaida
td Frank
td Software Engineer
td New York
td 63
td 2010/01/04
td $125,250
td 7439
td [email protected]
tr
td Zorita
td Serrano
td Software Engineer
td San Francisco
td 56
td 2012/06/01
td $115,000
td 4389
td [email protected]
tr
td Jennifer
td Acosta
td Junior Javascript Developer
td Edinburgh
td 43
td 2013/02/01
td $75,650
td 3431
td [email protected]
tr
td Cara
td Stevens
td Sales Assistant
td New York
td 46
td 2011/12/06
td $145,600
td 3990
td [email protected]
tr
td Hermione
td Butler
td Regional Director
td London
td 47
td 2011/03/21
td $356,250
td 1016
td [email protected]
tr
td Lael
td Greer
td Systems Administrator
td London
td 21
td 2009/02/27
td $103,500
td 6733
td [email protected]
tr
td Jonas
td Alexander
td Developer
td San Francisco
td 30
td 2010/07/14
td $86,500
td 8196
td [email protected]
tr
td Shad
td Decker
td Regional Director
td Edinburgh
td 51
td 2008/11/13
td $183,000
td 6373
td [email protected]
tr
td Michael
td Bruce
td Javascript Developer
td Singapore
td 29
td 2011/06/27
td $183,000
td 5384
td [email protected]
tr
td Donna
td Snider
td Customer Support
td New York
td 27
td 2011/01/25
td $112,000
td 4226
td [email protected]
// Container-fluid Ends
include ../../components/footer
include ../../components/footer-files