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 thisPin on Pinterest

I have seen this question more than once while going through different ASP.NET 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 Tutorial 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.

ASP.NET Web Forms and Web API Tutorial

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:
ASP.NET Web API Model
Web API Model
Following is the code for Student Model

ASP.NET Web API 2 Hands On
Building RESTful Web Service using ASP.NET Web API2 taking from beginner level and learn how to use the new features of Web API2 i.e. Attribute Routing etc. More Details

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.

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:

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:

     http://localhost:xxxx/api/Students

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
  • C. DELETE
  • 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.

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


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

Top ASP.NET MVC Jobs

Application Developer, 4 Days Remote, 1 Day in Office
Source: Indeed
Details: Designing and developing user interfaces using ASP.NET web forms and ASP.NET MVC. .NET Framework, Ajax, ASP.NET web forms, ASP.NET MVC, jQuery, nHibernate,...  More
30+ days ago

Des Moines, IA 04-November-2016

Developer, 4 Days Remote, 1 Day in Office
Source: Indeed
Details: Designing and developing user interfaces using ASP.NET web forms and ASP.NET MVC. .NET Framework, Ajax, ASP.NET web forms, ASP.NET MVC, jQuery, nHibernate,...  More
30+ days ago

Iowa City, IA 04-November-2016

.Net Developer
Source: Indeed
Details: .Strong Experience developing MVC applications using ASP.Net MVC. .4+ years experience in software engineering....  More
30+ days ago

Redmond, WA 30-November-2016

.NET Developer (Remote)
Source: Indeed
Details: ASP.NET MVC using C#. 3+ years of experience building web-based applications using ASP.NET MVC – C#. This is a full-time remote position....  More
6 days ago

Nashville, TN 13-January-2017

.NET Developer
Source: TS Solutions
Details: ASP.NET MVC (4), C#, Azure, SQL Server. TokuSaku (TS) Solutions is looking for .NET developer with numerous bolt-on skill sets to help with our list of direct...  More
19 hours ago

Seattle, WA 19-January-2017

ASP.NET / C# Software Developer (Web Services & API)
Source: Indeed
Details: C#, ASP.NET, MVC or better required, Java/Node.js a plus. The Software Developer is an experienced engineer that uses C#, ASP.NET, MVC to build web services,...  More
4 days ago

Tacoma, WA 16-January-2017

Senior Software Engineer (.Net)
Source: SmartDrive Systems, Inc.
Details: Expertise in C#, ASP.Net MVC, WCF, Web API, Angular JS and SQL Server. Architect, design and develop high performing web sites, mobile applications and scalable...  More
30+ days ago

San Diego, CA 18-October-2016

UX Developer
Source: Indeed
Details: Atleast 3+years of experience in development using .NET Framework technologies like C#, ASP.NET, MVC etc. • Excellent written and verbal communication skills •...  More
6 days ago

Redmond, WA 13-January-2017

Senior C# .NET Software Engineer
Source: Clark Associates
Details: Join one of Pennsylvania’s fastest growing companies today! WebstaurantStore, a division of Clark Associates, is looking for Senior C# .NET Software Engineer  More
9 days ago

Lititz, PA 17543 10-January-2017

C# ASP.Net Web Developer
Source: Indeed
Details: Experience with various web technologies, such as HTML, CSS, AJAX, JQuery, JavaScript, AngularJS, Bootstrap, XML, ASP.NET, MVC, WebForms, Web Services, IIS....  More
7 days ago

Irvine, CA 12-January-2017

Asp.net C# developer
Source: Indeed
Details: Asp.net MVC web development experience. 2-3 year C# and .net experience....  More
8 days ago

Indianapolis, IN 12-January-2017

Developer - Web
Source: Geocaching
Details: Proficient with ASP.NET, MVC, REST, WCF, Web API and scalable service oriented architectures. About Geocaching HQ....  More
13 days ago

Seattle, WA 98103 07-January-2017

C# Software Developer (Web Services & API)
Source: Indeed
Details: C#, ASP.NET, MVC or better required, Java/Node.js a plus. If you’re looking for a rewarding career with a dynamic and fast-growth healthcare software company,...  More
7 days ago

Seattle, WA 12-January-2017

Sr. ASP.NET Developer
Source: Indeed
Details: *ABSOLUTELY NO 3RD PARTIES FOR THIS POSITION* Participate and collaborate in design sessions ·Code / refactor one or multiple front-end web applications   More
14 days ago

Dallas, TX 75251 05-January-2017

ASP.NET MVC Web Developer
Source: Indeed
Details: 3+ years of C#, ASP.Net MVC, Entity Framework, HTML, JavaScript, JQuery, AJAX. We are in the process of switching applications from ASP.NET web forms into MVC 5...  More
15 days ago

Tigard, OR 04-January-2017

Jr .Net Developer
Source: Indeed
Details: Familiar with Web-API and REST in the ASP.NET MVC world. Professional job experience with C# and ASP.NET MVC (not just ASP.NET web forms). Full time/Long Term*....  More
21 days ago

Redmond, WA 29-December-2016

Technical Lead
Source: Morgan Stanley
Details: Must be experienced in AngularJS, client-side MVC, HTML5, CSS3, JavaScript,. Must have hands-on recent expertise in C#, ASP.NET, MVC, Web API, Rest Service....  More
30+ days ago

New York, NY 10032 19-December-2016

.NET Developer
Source: Indeed
Details: Web development using ASP.NET MVC. CANDIDATE MUST BE AVAILABLE FOR IN-PERSON INTERVIEW\*\*\*\*\*....  More
1 hour ago

Minneapolis, MN 20-January-2017

Developer Sr.
Source: Adroit Partners, LLC
Details: Use technologies, such as C#, ASP.NET, MVC, SQL, No-SQL (Couchbase, MongoDB), Enterprise Service Bus, to develop technical solutions to complex problems that...  More
6 hours ago

Houston, TX 20-January-2017

Software Developer
Source: Cortland Capital Market Services
Details: ASP.NET/MVC, HTML, Ajax, JQuery, JSON, JavaScript, XML/XSLT, CSS, NET 3.5/4.0/4.5 . A unique opportunity for a skilled and career-minded software engineer with...  More
8 hours ago

Brea, CA 20-January-2017

C#.Net Application Developer(Local: F2F)
Source: Indeed
Details: Web development using ASP.NET MVC. C#.Net Applications Developer*....  More
14 hours ago

Eden Prairie, MN 20-January-2017

.NET Developer
Source: Indeed
Details: C# .NET, ASP.NET, MVC, HTML 5, JQUERY, ANGULAR, JSON, RESTFUL WEB SERVICES, ENTITY FRAMEWORK, LINQ, RESPONSIVE WEB DESIGN, MS SQL and MOBILE....  More
16 hours ago

Rockville, MD 19-January-2017

C#.Net Developer
Source: Indeed
Details: Experience building web based applications with ASP.NET, MVC, Web Forms, HTML, CSS, JavaScript, jQuery and other client-side scripting technologies....  More
17 hours ago

Winter Springs, FL 19-January-2017

Sr. Full Stack C#/.NET Developer (10+ Years experience)
Source: Indeed
Details: MVC:. Expertise in most of the following - REACT.JS, Web API (MS ASP.Net), MVC, WCF, HTML5, CSS, JavaScript, JSON, SOAP, REST, JQuery, .Net Framework, C#, Web...  More
1 day ago

Austin, TX 18-January-2017

UI developer w/ .NET background
Source: Avani Tech Solutions
Details: MVC. ASP MVC/Web API. 5 years developing applications using ASP.NET MVC. UI developer w/ .NET background....  More
1 day ago

Houston, TX 18-January-2017
Share on FacebookShare on Google+Tweet about this on TwitterShare on LinkedInDigg thisPin on Pinterest
Category: ASP.NET Web API ASP.NET Web Forms Tags: ,

About IMRAN ABDUL GHANI

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.