The jQuery DataTables plugin provides a wide variety of extensions, which can enhance the functionality of the plugin dramatically.
The ColReorder extension allows users to reorder table columns by clicking-and-dragging the column header to the location they prefer. To enable column reordering for your DataTables HTML table, complete the following steps:
Open the
_Layout.cshtml
file and add a reference to thedataTables.colReorder.css
file:<link rel="stylesheet" type="text/css" href="//cdn.datatables.net/colreorder/1.1.1/css/dataTables.colReorder.css">
Open the view
.cshtml
file and add a reference to the DataTables, DataTables Bootstrap, and ColReorder extension JavaScript files:<script type="text/javascript" language="javascript" src="//cdn.datatables.net/1.10.0/js/jquery.dataTables.min.js"></script> <script type="text/javascript" language="javascript" src="//cdn.datatables.net/plug-ins/be7019ee387/integration/bootstrap/3...