jQuery Datatable Single Column Search

This article gives an overview of how to use jQuery datatable in MVC to perform single column search in jQuery Ajax. I will use jQuery datatable plugin in this demo application and explain how to apply single column search. Here is the code.

This is final output of the application.

This example requires the following basic understanding

There are multiple ways to create a new project in Visual Studio 2019. When you first open Visual Studio, the start window appears, and from there, you can choose to create a new project.

If the Visual Studio development environment is already open, you can create a new project by choosing File > New > Project on the menu bar or by clicking the New Project button on the toolbar.

On the Create a new project page, a list of your recently selected templates appears on the left. The templates are sorted by most recently used.

If you're not selecting from the recently used templates, you can filter all available project templates by Language (for example, C#), Platform (for example, Windows or Azure), and Project type (for example, Desktop or Web). You can also enter search text into the search box to further filter the templates, for example, asp.net.

Select a template and then click Next.

The Configure your new project page has options to name your project (and solution), choose a disk location, and select a Framework version (if applicable to the template you chose).

Click Create to create the new project.

In create a new ASP.NET Web Application window choose MVC template click on create. Visual Studio will generate MVC Web Application project for you.

In Visual Studio tools go to NuGet Package Manager and select Manage NuGet Packages for solution.

Install the following package for this application,

Right click on Models Folder choose new item “Add” class Employee.

Create Data Folder and add class ApplicationDbContext for database communication.

Add bootstrap, jQuery and datatable plugin in _Layout.cshtm