HTML and CSS Reference
In-Depth Information
This web form displays all the records from the
Customers
table of the Northwind database in an
HTML table. The row at the top allows the user to insert a new customer. Existing customers can be
modified or deleted using the Update or Delete button, respectively. The
SELECT
,
INSERT
,
UPDATE
, and
DELETE
(CRUD) operations are performed through ASP.NET Web API. The methods exposed by the Web API
controller class are invoked using the
XMLHttpRequest
object. The web form markup is simple and is shown
in Listing 11-7.
Listing 11-7.
Markup for the Customer List Web Form
<h3>Customer List</h3>
<form id=”form1” runat=”server”>
<table id=”tblCustomers”>
</table>
</form>
The web form consists of a table:
tblCustomers
. The rows of the table are added programmatically
depending on the number of customer records in the database. The Entity Framework data model
required by the application is shown in Figure 11-4.
Figure 11-4.
Entity Framework data model class for the
Customers
table
The
Customer
data model class has several properties, but only four are used in the application:
CustomerID
,
CompanyName
,
ContactName
, and
Country
.
Developing a Web API Controller
To perform CRUD operations on the
Customers
table, you develop a Web API controller
(
CustomerController
). A Web API controller is a class that inherits from the
ApiController
base class and
contains an implementation for the following methods:
•
Get()
: Represents an HTTP
GET
request that
SELECT
s data items and returns them to
the caller.
