Developing Web Applications Using ASP.

NET
Objectives

In this session, you will learn to:

Describe a Web Part and the purpose of Web Parts
Describe the components of a Web Part page and identify
scenarios when Web Part pages are useful features of Web
applications
Describe the more advanced features of Web Parts, including
connections between Web Parts
Create Web Part pages
Create Web Parts

Ver. 1.0 Slide 1 of 17

Developing Web Applications Using ASP.NET
What is a Web Part?

In an application that has been built using Web parts, a user

can rearrange the components on a page, remove
components from a page, or add components from a
catalog.
Web parts appear on the page as discrete sections with
their own distinct user interface and functionality.
A Web part can display data from various sources.
Each Web part has a set of verbs, which are actions that the
user can take.
Verbs appears as links or buttons on a Web part.

Ver. 1.0 Slide 2 of 17

Developing Web Applications Using ASP.NET
What is a Web Part? (Contd.)

A page that is implemented by using Web parts allows

customization of the appearance and contents of the page
by allowing a user to:
Remove Web parts
Add Web parts from a catalog
Rearrange Web parts
Minimize Web parts
Change the appearance of Web parts
Web parts also enable users to personalize Web part
properties such as:
Region property of a Weather Report Web part.
Industry property of a Stock Quotes Web part.
Pages collection in a Web Traffic Web Part.

Ver. 1.0 Slide 3 of 17

Developing Web Applications Using ASP.NET
What is a Web Part? (Contd.)

A user can add a new Web part to the page by using the
Web parts catalog.
The Web parts catalog displays a list of all available Web
parts that are not already on the page.
A user can select a Web part from the catalog to add it to
the display.
When a user removes a Web part from the page, it
reappears in the catalog.

Ver. 1.0 Slide 4 of 17

Developing Web Applications Using ASP.NET
Web Part Controls

The Web parts control set is extensive, but some controls

are essential.
A developer needs to be familiar with the following Web part
controls to create a basic Web part page:
WebPartManager
CatalogZone
EditorZone
WebPartZone
ConnectionsZone
GenericWebPart
CatalogPart
Connection
EditorPart

Ver. 1.0 Slide 5 of 17

Developing Web Applications Using ASP.NET
What is Web Part Page?

Many of the advanced capabilities that Web parts provide

are enabled by the Web part pages on which the Web part
is placed and do not work on ordinary ASP.NET Web Form
pages.
Every Web part page contains one or more zones.
The purpose of a zone is to contain Web parts, to organize
them, and to provide elements of the user interface.
Each zone can be oriented horizontally or vertically.
Every Web part must include a WebPartManager object.
The WebPartManager object is an invisible object that
performs a number of essential tasks on the page, such as:
Tracking the Web parts on the page
Tracking the zones that contain Web parts
Tracking the order of Web parts in the zone

Ver. 1.0 Slide 6 of 17

Developing Web Applications Using ASP.NET
Web Part Page Display Modes

A Microsoft ASP.NET Web Parts page can enter several

different display modes.
A display mode is a special state that applies to an entire
page, where certain user interface elements are visible and
enabled, while others are invisible and disabled.
Display mode enables users to perform certain tasks to
modify or personalize a page.
A page can be in only one display mode at a time.
The WebPartManager control contains the
implementations for the display modes, available in the Web
parts control set and manages all display mode operations
for a page.

Ver. 1.0 Slide 7 of 17

Developing Web Applications Using ASP.NET
Web Part Page Display Modes (Contd.)

Display mode of a page can be changed programmatically

by using the DisplayMode property.
There are five standard display modes in Web Parts control
set:
Browse
Design
Edit
Catalog
Connect
All the display modes are derived from the
WebPartDisplayMode class.

Ver. 1.0 Slide 8 of 17

Developing Web Applications Using ASP.NET
Connected Web Parts

Web part connections provide a route to transmit and

receive information among Web parts, in case they need to
work together.
A Web part can be connected to another Web part by using
connection points.
When two Web parts are connected, one of them acts as a
data provider and the other acts as a data consumer.
A connection point is an instance of a
ConnectionPoint-derived class.
A connection point can be created by using:
ConnectionConsumerAtribute class
ConnectionProviderAttribute class

Ver. 1.0 Slide 9 of 17

Developing Web Applications Using ASP.NET
Connected Web Parts (Contd.)

A custom connection point can be created by inheriting from

the ConnectionPoint class; or by inheriting from
ConnectionConsumerAtribute class or
ConnectionProviderAttribute class.
A control acting as either a consumer or a provider can
have multiple connection points.
Connections between controls in a Web Parts zone can be
of two types:
Static
Dynamic

Ver. 1.0 Slide 10 of 17

Developing Web Applications Using ASP.NET
Connected Web Parts (Contd.)

When creating a connection:

A control acting as a data provider defines a communication
contract indicating the data it can provide.
Another control, acting as the consumer and with the
knowledge of the communication contract , retrieves the data.
Connections between controls in a Web parts zone use a
communication contract in the form of an interface.

Ver. 1.0 Slide 11 of 17

Developing Web Applications Using ASP.NET
Connected Web Parts (Contd.)

Personalizing Connections:
When you enable Connection Display mode for a Web part
page, you enable users to customize and save the connections
according to their preference.
When a page is in the Connection Display mode:
The Connections Zone is displayed to the user.
A user can use the Connections Zone to join connection points and
route data from one Web part to another.

Ver. 1.0 Slide 12 of 17

Developing Web Applications Using ASP.NET
Connected Web Parts (Contd.)

Transformers:
Data can be reformatted when it is passed between Web parts
by using a transformer.
Several transformers are included in ASP.NET 2.0 such as
System.Web.UI.WebControl.WebParts.
RowToFieldTransformer.
A custom transformer can be created by inheriting from the
WebPartTransformer class.

Ver. 1.0 Slide 13 of 17

Developing Web Applications Using ASP.NET
Demo: Building Web Part Pages and Web Parts

Problem Statement:
You are a developer in the Adventure Works organization, a
fictitious bicycle manufacturer. You have been asked to assist
in creating a new Business-to-Consumer (B2C) Web
application and a related Business-to-Employee (B2E) extranet
portal.
Decisions on the design of the application have already been
made. You have been asked to carry out a number of specific
tasks in order to implement various elements of this design. As
part of the B2C development, you have been asked to
prototype a Web Part Page for employees’ extranet portal.

Ver. 1.0 Slide 14 of 17

Developing Web Applications Using ASP.NET
Demo: Building Web Part Pages and Web Parts (Contd.)

Solution:
To solve this problem, you need to perform following tasks:
1. Create a Web Part Page
a. Open the starter solution.
b. Manage roles for the employee portal
c. Start SQL Express
d. Add the employee portal Web page
e. Add Web Part framework controls and a layout to the employee portal
Web page
f. Add mode-switching capabilities to the portal page

Ver. 1.0 Slide 15 of 17

Developing Web Applications Using ASP.NET
Demo: Building Web Part Pages and Web Parts (Contd.)

2. Create a Web Part

a. Add and develop a User Control.
b. Add and configure the User Control as a Web Part.
c. Test the portal.aspx page.
d. Test the Web Part Page personalization behavior.

Ver. 1.0 Slide 16 of 17

Developing Web Applications Using ASP.NET
Summary

In this session, you learned that:

ASP.NET Web Parts give the developer a way to support
extensive personalization on a Web page by providing a
means for rearranging, adding, and removing the components
of the page at runtime.
Catalog contains a list of the Web Parts available, that can be
added to the display.
Web parts can be created to work together to present related
information or to provide richer user interface.
Web parts can be connected with each other by using
connection points.

Ver. 1.0 Slide 17 of 17