Using jQuery DataTables in ASP.NET MVC6 for pagination, sorting and filtering
If you use tables in your ASP.NET MVC project you most likely would like to do searching, sorting and filtering of these tables. The jQuery plugin dataTables will give you excactly those features with the least amount of effort.
There is a lot of good documentation on the datatables website. I will provide you with a little example on how you can implement this in an ASP.NET Core 1.0 MVC 6 application.
I have an Index.cshtml that generates the table I would like to enhance using datatables.
</script>
There is a lot of good documentation on the datatables website. I will provide you with a little example on how you can implement this in an ASP.NET Core 1.0 MVC 6 application.
I have an Index.cshtml that generates the table I would like to enhance using datatables.
Step 1: Reference the libraries
First of all you need to add jQuery and DataTables to your file. I am adding these to the _Layout.cshtml file, but they can also be included som place else as long as the libraries becomes available.
Step 2: Make sure your table has an ID
For datatables to be able to find your table in the DOM you need to give it an ID.
This ID will be used when you do tha basic datatables initialization (below).
<
table
id
=
"example"
.....>
Step 3: Initialize DataTable with a few lines of Javascript code
<script>$(document).ready(
function
() {
$(
'#example'
).DataTable();
} );