5 simple steps for using Web API with ASP.NET Web Forms Application

By | May 12, 2014
Share on FacebookShare on Google+Tweet about this on TwitterShare on LinkedInDigg thisShare on StumbleUponPin on Pinterest

I have seen this question more than once while going through different ASP.NET web forums that “Is it possible to use Web API with ASP.NET Web Forms Application?” Simple answer to the question is “YES, we can“.

Let’s discuss about it in more details. As we already know that Microsoft released ASP.NET MVC 4 with lots of new and exciting features including ASP.NET Web API which is basically a framework for building HTTP services that reaches broader range of clients including browsers as well as mobile devices. But it’s flexible enough to be used with ASP.NET Web Forms applications. In this ASP.NET Tutorial, we are using a step by step approach for using Web API with ASP.NET Web Forms. For a good comparison of features released in each version of ASP.NET MVC, click here.I have already implemented an HTTP service using ASP.NET Web API in one of my previous post that you can refer here. Adding a Model and a Controller is same but the difference is that we are adding it to ASP.NET Web Forms Application. So, let follow the steps as below:

  1. Create a New Web Forms Application.
  2. Add Model to Web Forms Application.
  3. Add Controller to Application.
  4. Add Routing Info to Global.asax.
  5. Making a Client Call.
For the purpose of implementation, I am using Visual Studio Express 2013 for Web here.

1. Create a New Web Forms Application

  • Open Visual Studio and create “New Project” i.e. File -> New Project.
  • Choose “ASP.NET Web Application” template and name project as “WebAPIwithWebForms”.
  • When you click “OK” button, a new window will appear for selecting a sub-template.
    Note: You may not get window for sub-template in older versions of Visual Studio.
  • Choose “Web Forms” and click “OK”.
Using Web API with Web Forms
  • An ASP.NET Web Forms template project is created.

2. Add Model

Now we need to add a new class that acts as a Model in our application as follows:
Web API Model
Following is the code for Student Model
    public class Student
        public int StudentID { get; set; }
        public string FirstName { get; set; }
        public string LastName { get; set; }

3. Add Controller class

Controller class has special importance because request coming from client reaches the controller first. Then the controller decides which model to use in order to serve the incoming request.
Right click on the project and choose “Web API Controller” under “Add” from the context menu as shown in figure.
ASP.NET Web API Controller
Web API Controller
Name the controller as “StudentsController” and press “OK” button.
For the purpose of simplicity, I’ll load the model with data inside our “StudentsController” instead of loading directly from database. Following is the code for StudentsController inheriting from ApiController class.
public class StudentsController : ApiController
        Student[] students = new Student[]
             new Student { StudentID = 1, FirstName = “Imran”, LastName = “Ghani” },
             new Student { StudentID = 2, FirstName = “Salman”, LastName = “Ahmad” },
             new Student { StudentID = 3, FirstName = “Rehan”, LastName = “Ahmad” },
             new Student { StudentID = 4, FirstName = “Zeeshan”, LastName = “Khalid” }
        public IEnumerable<Student> GetStudents()
            return students;

4. Add Routing Info to Global.asax

In order to route incoming request directly to our StudentsController, we need to add Route Information to Application_Start method of Global.asax as given below:
          name: “DefaultApi”,
          routeTemplate: “api/{controller}/{id}”,
          defaults: new { id = System.Web.Http.RouteParameter.Optional }

Now, if you run your application and try to access the following URL, you will get a JSON response of student data from api controller. Try to access the following URL and see:


Note: Don’t forget to add “using System.Web.Http” in Global.asax.cs file.

You are designing an ASP.NET Web API application. You need to select an HTTP verb to allow blog administrators to moderate a comment. Which HTTP verb should you use?

  • A. GET
  • B. POST
  • D. PUT

To further test your ASP.NET Web API skill, Take a Complete FREE Online Test or MCSD Practice Exam: 70-486 (Developing ASP.NET MVC Web Applications). Simply Click Here.

 Correct Answer: D

5. Make a Client Call

As you have already see above your ASP.NET Web API returning data in JSON format. Now, let’s call it from your Web Form using jQuery and display it on your Web Form page.
Create a new Web Form page “WebFormClient” and add the following code to call your ASP.NET Web API Controller i.e. “StudentsController” using jQuery.Main content area will contain the following HTML for rendering Students data.

<table border=’1′ id=”students”>
       <!– Make a Header Row –>

using jQuery, make a call to our controller and fetch data as follows:

function GetAllStudents()
                       type: “GET”,
                       url: “http://localhost:xxxx/api/Students/”,
                       contentType: “json”,
                       dataType: “json”,
                       success: function (data) {
                                  $.each(data, function (key, value) {
                                  var jsonData = JSON.stringify(value);
                                 //Parse JSON
                                 var objData = $.parseJSON(jsonData);
                                 var id = objData.StudentId;
                                 var fname = objData.FirstName;
                                 var lname = objData.LastName;                                $(‘<tr><td>’ + id + ‘</td><td>’ + fname +
                                       ‘</td><td>’ + lname + ‘</td></tr>’).appendTo(‘#students’);                       });
             error: function (xhr) {

Hopefully, above step by step approach will be helpful in building Web API with ASP.NET Web Forms Application.

Other Related Web Development Articles:

Top 10 Interview Questions and Answers Series:

Latest Developers Jobs


Senior .NET Developer
Source: Indeed
Details: Proficiency in developing enterprise level web applications using ASP.NET, MVC 4/5 & ORM & web services (REST, SOAP)....  More
5 days ago

Seattle, WA 19-October-2016

Full Stack .Net Developer ***LOCAL OR FULL TIME NEED TO APPLY!)
Source: Indeed
Details: Visual Studio 2015, SQL Server 2008+ architectural, .NET 4/4.5 FCL, C# language and syntax, SQL, ASP.NET/ASP.NET MVC, HTML 5, and CSS 3....  More
10 days ago

Bellevue, WA 98004 14-October-2016

Senior .Net Developer
Source: Indeed
Details: ASP.Net, MVC, Web API, SQL Server, .NET 4.5, NUnit, Nhibernate, GIT, Team City:. Must have 10 or 10+ years of experience on ASP.Net, MVC, Web API, SQL Server,...  More
2 hours ago

Bloomington, MN 24-October-2016

Senior .Net Developer (only GC/USC)
Source: Indeed
Details: ASP.NET MVC 5/6 and Web API. Need experienced Software engineers to work on an exciting project for a specialty provider of clinical trial services....  More
2 days ago

Reston, VA 22-October-2016

Senior .Net developer with minimum 10 years of experience
Source: Indeed
Details: Strong experience developing ASP.NET MVC applications, SPA, responsive UI. Proficient in ASP.NET as well as ASP.NET MVC web frameworks....  More
2 days ago

Pleasanton, CA 22-October-2016

Senior .Net Developer
Source: Indeed
Details: Experience in developing applications using ASP.NET MVC. Om Group is seeking a Sr....  More
3 days ago

Reston, VA 21-October-2016

Full Stack Web Developer
Source: Centerplate
Details: Extensive knowledge of SQL and experience with MySQL, DB2, or MS-SQL Knowledge of MVC architecture and experience with MVC Frameworks (Zend, Symphony, ASP.NET...  More
6 days ago

Greenville, SC 17-October-2016

Senior .NET Developer
Source: Indeed
Details: Proficiency in developing enterprise level web applications using ASP.NET, MVC 4/5 & ORM & web services (REST, SOAP)....  More
5 days ago

Miami, FL 19-October-2016

Senior .Net Developer
Source: CorVel Corporation
Details: CorVel Corporation is looking for a senior .NET developer to design, develop and implement proprietary enterprise applications. CorVel is a national provider  More
2 days ago

Irvine, CA 22-October-2016

C#.Net UI/UX Senior Developer
Source: Indeed
Details: C#, ASP.NET MVC, AngularJS, Javascript. We are looking for a Senior Developer to hit the ground running!...  More
10 days ago

Overland Park, KS 14-October-2016

Senior .Net Developer, MVC
Source: Indeed
Details: Experience in MVC, preferably ASP.NET MVC 4. Alteso is looking to add a developer to our technology team building cutting edge software for the Auto Re...  More
12 days ago

Trevose, PA 19053 12-October-2016

ASP.Net/C# Developer (Programmer Analys...
Source: Tacoma-Pierce County Health Department
Details: Knowledge of and skill in ASP.Net, MVC, C#, MS SQL, HTML, CSS, JavaScript. Are you a skilled professional that enjoys programming, troubleshooting and managing...  More
16 days ago

Tacoma, WA 08-October-2016

Senior .NET Developer
Source: Nature's Sunshine
Details: Duties: • Participate in architectural design and the creation development standards. • Lead or support development efforts to create new, or enhance, website  More
16 days ago

Lehi, UT 07-October-2016

C#/.Net/MVC Developer (Oak Hill)Basic text editing
Source: RevolutionInsure
Details: If you are a seasoned full stack .NET MVC developer interested in a startup. Experience developing within a Windows environment using Microsoft's Visual Studio...  More
1 day ago

Austin, TX 23-October-2016

Sr. C#/.Net/MVC Developer (Oak Hill)
Source: RevolutionInsure
Details: Knowledge of C#, ASP.Net MVC, Azure and SQL Server with emphasis on writing modular, scalable code. Experience with start-ups, MVC migration, familiarity with...  More
1 day ago

Austin, TX 23-October-2016

Dot Net Developer
Source: Sonsoft Inc
Details: At least 3 years of hands-on experience in Web Technology like ASP .NET Web Forms , ASP.NET MVC, C#. At least 4 years of experience developing responsive Web...  More
30+ days ago

Dallas, TX 08-September-2016

C#/.NET Software Developer
Source: Indeed
Details: Be ready and willing to jump in on projects outside of your comfort zone as needed, including but not limited to WinForms, ASP.NET MVC, and T-SQL....  More
4 days ago

Sandy, UT 84070 20-October-2016

Sr. AngularJS Full-Stack Microsoft Developer
Source: Indeed
Details: Must have foundational, logical and creative abilities with many technologies including .NET, ASP.NET MVC, AngularJS, WCF, Rest, Web API's, HTML5, AJAX, JSON,...  More
24 days ago

Austin, TX 30-September-2016

C# / ASP.NET Developer
Source: Indeed
Details: NET Web DevelopmentC# /ASP.NET MVC / .NET Core 1.0. Reusable Design SolutionsASP.NET MVC 4/5. The C# / ASP.NET Developer will design, develop, deploy, and...  More
6 days ago

Springfield, MO 65807 18-October-2016

Full Stack Developer
Source: Ledgent Technology & Engineering
Details: Nice to have Classic ASP. Provide expertise in using ASP.net, MVC framework, C#, Javascript and SQL. Want an experienced web developer with .net, classic asp,...  More
25 days ago

Huntington Beach, CA 29-September-2016

Full Stack .Net Developer
Source: Indeed
Details: &mdash;Web API (MS ASP.Net), MVC, WCF, HTML5, CSS, JavaScript, JSON, SOAP, REST, JQuery, .Net Framework, C#, Web Services....  More
26 days ago

Round Rock, TX 28-September-2016

APS.NET MVC Full-Stack Senior Web Developer
Source: Indeed
Details: Strong Design and architecture experience - ASP.NET MVC Architecture and Entity Framework Code First.*....  More
25 days ago

Atlanta, GA 29-September-2016

Senior C#/.NET Service Developer
Source: Indeed
Details: Currently uses ASP.NET MVC and other Model-View design patterns. Strong .NET technologies including C#, ASP.NET, MVC, AJAX, jQuery, JSON, WebAPI, RESTful...  More
25 days ago

Parsippany, NJ 29-September-2016

.NET Developer - Face to Face Interview in FL & PA
Source: Indeed
Details: .Net Developer Long Term Contract Face to Face Interview MUST HAVE:  6+ years’ experience in Software Development with .Net including: o C# o ASP.NET o...  More
7 days ago

Harrisburg, PA 17-October-2016

Senior .Net Developer
Source: Indeed
Details: Strong experience developing ASP.NET MVC applications, SPA, responsive UI. Proficient in ASP.NET as well as ASP.NET MVC web frameworks*....  More
25 days ago

Pleasanton, CA 29-September-2016
Share on FacebookShare on Google+Tweet about this on TwitterShare on LinkedInDigg thisShare on StumbleUponPin on Pinterest
Category: ASP.NET Web API ASP.NET Web Forms Tags: ,


Imran Abdul Ghani is working as Software Developer(Senior) with extensive knowledge in Web development technologies especially C#, ASP.NET, MVC, WCF, Web API, ADO.NET Entity Framework, jQuery etc. He has several years of experience in designing/developing enterprise level applications. He is Microsoft Certified Solution Developer for .NET (MCSD.NET) since 2005. You can reach his blogging at www.webdevelopmenthelp.net, www.topwcftutorials.net, and www.sharepointfordummies.net.