Call ASP.NET WebAPI Using jQuery

As we need an unordered list multiple times, we store it in a variable, as given below-


Instead of finding in DOM every time, we will use this variable ulEmployees. Now, let’s associate a click event handler to this and Get All Employees button, as given below-



Thus, when we click the button, we want to call ASP.NET Web API Service, using jQuery AJAX. Thus, let’s use jQuery AJAX function, as given below-
Thus, this is our code, as we are using Get. Now, our Employees.html is present in the same project, so our URL will be relative URL here as api/pagename.html.

As we want data in JSON, we have to specify the datatype as JSON . Next, we are looping through each record in the database. We are passing an index value of each employee and displaying the names respectively.

Build the solution and run the app. We will see the output, as given below-



Notice, when you click on Get All Employees button, we get the list of employees, which we had written in Get method. When you click on Clear Button, the data clears.

Conclusion - This was all about calling ASP.NET WebAPI, using jQuery. Hope, this article was helpful!!