JQuery DataTable - Paging, Sorting, Searching In ASP.NET from Code Behind

Nowadays, jQuery Data Table is the best way to represent data in tabular format because it supports client side searching, sorting and pagination (client/server side) through ajax/html request.

This is a nice alternative if you want to display tabular information but you want to use something different than a repeater or a GridView or other commercial (and usually expensive) .NET server components.

In these articles I am going to explain an easy way to integrate JQuery DataTable in our ASP.NET application and enable or disable some features of it.



Step 1: Firstly, we have to create a New Project in Visual Studio and Add a Web Form with any name like here my page name is Default.aspx



Step 2: Step Two is little bit simple. In this we have to include some Js and Css for DataTable in our project.

Note: You can download these from the following link also or you can download it from source code of this demo.

• code.jquery.com/jquery-1.12.0.min.js
• cdn.datatables.net/1.10.10/js/jquery.dataTables.min.js

Step 3: Now design part start. Here we have to design a Table with id as example as shown below.



Step 4: Now we are going to bind HTML Table dynamically from code behind just like we bind grid view in ASP.NET. Here is code to bind Html Table from code behind on page load event as shown below.



Step 5: Now we are going to enable JQuery Data Table in-built features by writing some few lines of script. Here is the script to enable JQUuery Html Data Table Features as shown below.



Note: There are a lot of built-in features of jQuery DataTable. My advice is to you all just go on its official website and explore some really great features of it.

• datatables.net

Here I am providing some basics of how to bind JQuery DataTable from code behind in ASP.NET and enable some features of it just like GridView. I have also attached the demo of this project including Database script. Just run the script and change connection string and enjoy the features of Html Data Table.

Hope this article will help the beginners to understands the basics of JQuery Data Table in ASP.NET.