An Architectural Introduction to Web Parts and ASP.NET

An Architectural Introduction to Web
Parts and ASP.NET
A Microsoft® Office FrontPage® 2003 White Paper
This white paper discusses the technology behind Web Parts. The paper begins by discussing
ASP.NET and describes the fundamentals of a Web Forms page. This discussion segues into
a high-level overview of building a Web Part using Visual Studio.NET 2003 including mention
of the interfaces that a Web Part needs to expose in order to be connectable to other Web
Parts.
Note: The instructions, screenshots, and behavior discussed in this white paper are based
on Microsoft Internet Explorer version 5.5 or above. The user experience with prior
versions of Microsoft Internet Explorer and with other browsers is going to be different – in
general, the same level of features may not be available.
The examples in this white paper assume that Windows SharePoint Services is installed
on a server named myserver1024. This server also has Microsoft SQL Server with the
Northwind sample database installed on it
Requires a familiarity with the basics of C# language and the .NET framework.
Published: November 2003
For the latest information, please see http://www.microsoft.com/url/
Contents
Introduction .................................................................................................................................1
Web Part Framework ..................................................................................................................2
What Are Web Parts? ............................................................................................................2
Web Parts and Windows SharePoint Services .....................................................................2
Composition of a Web Part....................................................................................................3
Brief Overview of ASP.NET ........................................................................................................4
ASP.NET Web Applications ..................................................................................................4
Web Forms Pages and Server Controls ................................................................................4
ASP.NET Custom Controls....................................................................................................7
Creating Custom Web Parts .....................................................................................................11
Installing the Web Part Library Template ............................................................................11
Creating and Deploying Web Part .......................................................................................12
Example: A Sample Web Part .............................................................................................12
Creating a Web Part Description File (dwp) ........................................................................14
Deploying the Web Part .......................................................................................................15
Deploying in a Windows SharePoint Services Library ....................................................15
Importing the Web Part into a Specific Page..................................................................16
Using the Web Part in FrontPage 2003 ...............................................................................16
Conclusion (Style = Heading 1).................................................................................................21
References ................................................................................................................................21
Introduction
The Web Part Framework in Windows SharePoint Services provides a powerful and easy to
use platform for developing data driven web sites. Microsoft FrontPage 2003 integrates closely
with Windows SharePoint Services and is the easiest and the most powerful web site design
tool that enables creation of a new category of collaborative, scalable, data driven web sites.
The Web Part Framework in Windows SharePoint Services is used by three categories of
users:

End users personalize a Web Part Page to simplify and focus on the information that is
most relevant to them. They do this by customizing web part properties

Web Page Authors use Web Parts to build custom solutions based on Windows
SharePoint Services.

.NET developers extend Windows SharePoint Services by encapsulating web services
and enterprise data as Web Parts.
The goal of this document is to enable Web Page Authors to make more efficient use of the
Web Part Framework by illustrating how .NET developers write Web Parts.
An Architectural Introduction to Web Parts and ASP.NET
1
Web Part Framework
The Web Part Framework is the basis for extensibility in Windows SharePoint Services. It
allows developers to write custom components that plug into the SharePoint infrastructure by
encapsulating web services and enterprise data as Web Parts.
Windows SharePoint Services as a whole is based heavily on .NET technologies:

ASP.NET instead of ISAPI for base page execution

CLR based server object model for programmatic access to SharePoint data

XML Web services-based access of SharePoint data from remote machines
In keeping with this investment in .NET technologies, the Web Parts Framework is also based
entirely on ASP.NET:

Web Part pages are ASP.NET pages.

Web Parts are ASP.NET custom controls.
The fundamental notion in the Web Part Framework is that of a Web Part Page. A Web Part
Page is essentially a scalable version of the Digital Dashboard. It is a container of Web Parts.
A Web Part Page uses Windows SharePoint Services to store per-user views of the page,
which enables powerful customizations on a user-by-user basis.
What Are Web Parts?
Web Parts are customizable plug and play components that empower information workers to
create personalized user interfaces by simply dragging and dropping them onto a web page.
Web parts allow customization at both design time and at run time. In fact, Web Parts blur the
distinction between design time and run time:

Web page authors use FrontPage 2003 to work with Web Parts by dragging and dropping
them to a Web Part Page, and then customizing them using the developer enabled
properties. In this sense, Web Parts are similar to design time controls.

Web Parts also enable web page authors to use the browser as their authoring platform.
Windows SharePoint Services provides a browser-based interface to design a SharePoint
based site.

The end user can customize a Web Part Page at run time by modifying the properties of
each individual web part. The page author can designate which web parts can be
customized or not by grouping them into “zones” and setting the appropriate properties on
the zone using FrontPage 2003.
From the point of view of a developer, a web part is simply a specialized ASP.NET server
control. To create a new Web Part, you create an ASP.NET custom control. However, unlike
standard ASP.NET controls, which developers add to Web form pages at design time, Web
Parts are intended to be added to Web Part Pages either by authors at design time, or by
users at run time.
Note: Developers can also use Web Parts in “regular” ASP.NET pages, but in doing so,
the developer loses the advantages of integration with Windows SharePoint Services.
Web Parts and Windows SharePoint Services
Web Parts rely heavily on Windows SharePoint Services to support:
An Architectural Introduction to Web Parts and ASP.NET
2

Creation of new sites and new pages

Management of the user roster for a site

Storage of Web Part customizations, including shared and personal property settings

Administration of site backups and storage limits

A scalable architecture that can handle thousands of sites and millions of users

Assignment of users to customizable site groups
In turn, SharePoint Products and Technologies rely on Web Parts to provide configurable and
extensible user interfaces.
Composition of a Web Part
A Web Part is composed of the following entities:

The Web Part description file (.dwp) is a portable container of default and personalized
property values for the Web Part.

The Web Part assembly file (.dll) contains the logic and code for the Web Part, and is
installed on the server running Windows SharePoint Services.

Resource files that support the Web Part; these are also stored on the server.

Tables in the Windows SharePoint Services database are used to store current values of
the Web Part properties.
Windows SharePoint Services has been designed from the ground-up to be a powerful
collaborative platform. It is possible and indeed commonplace for your web site to contain
multiple instances of the same Web Part. Each instance would conceivably have a different
set of properties.
Regardless of the number of instances of the Web Part, there is only one Web Part assembly
file. Any instance-specific customizations are stored in the .dwp file and there exist as many
.dwp files for a Web Part as there are instances of that part.
An Architectural Introduction to Web Parts and ASP.NET
3
Brief Overview of ASP.NET
As we noted in the Introduction, the Web Part infrastructure is based on .NET technologies,
specifically ASP.NET. Web Parts themselves are specialized ASP.NET custom controls and
they reside on a Web Part Page, which is a specialized ASP.NET web forms page.
For readers that may not be familiar with these technologies, this section gives a very brief
overview the main concepts. The reader should refer to many excellent books and articles on
this topic.
ASP.NET Web Applications
ASP.NET is part of the .NET Framework and is the core technology for developing web
applications and XML Web Services. ASP.NET pages run on the server and generate markup
such as HTML, WML, or XML that is sent to a desktop or mobile browser. ASP.NET pages
use a compiled, event-driven programming model that improves performance and enables
separating the application logic and user interface. ASP.NET pages and ASP.NET XML Web
services files contain server-side logic (as opposed to client-side logic) written in Visual Basic
.NET, C# .NET, or any .NET-compatible language. Web applications and XML Web services
take advantage of the features of the common language runtime, such as type safety,
inheritance, language interoperability, versioning, and integrated security.
An ASP.NET web application is defined as all files, pages, handlers, modules, and executable
code that you can invoke or run in the scope of a given virtual directory (and its subdirectories)
on an IIS server. Typical ASP.NET applications consist of the following:

One or more web forms pages – which are text files with an .aspx extension. These pages
typically consist of HTML markup which declares the controls on the page and specifies
their formatting and layout attributes.

One or more code files; you can developed in develop code C#, Visual Basic, J#, Jscript,
etc. The code files contain the web application’s logic, including control event handling,
postback handling, etc. The code files are tightly bound to the aspx files and are referred
to as “code behind”.

A Global.asx file to deal with session and application startup and clean-up logic. This file is
optional.

A Web.config file used to store configuration settings. This file is optional, and is new for
ASP.NET
Web Forms Pages and Server Controls
Let’s look at a web forms page in more detail. In doing so, we will gain an understanding of
ASP.NET server controls and code behind files.
Note This section provides a walkthrough for building an ASP.NET web application so that the
reader can gain an understanding of the platform technologies that form the basis for web part
pages. However, it is not possible to run arbitrary ASP.NET code within a web part page;
specifically, you cannot insert the code presented in this section inside a web part page.
Web forms are ASP.NET pages which use ASP.NET server controls. Server controls are a set
of built-in controls which are similar to Microsoft Visual Basic controls – essentially, prewritten
pieces of code which you can drag and drop into your application. Just like Visual Basic
controls, ASP.NET server controls are event driven; the developer’s task is to write code that
An Architectural Introduction to Web Parts and ASP.NET
4
handles events raised by the controls. This code appears in the code-behind file of the
corresponding aspx file.
ASP.NET provides two sets of built-in server controls:

HTML controls, which provide a 1-1 mapping to HTML elements

Web controls, which provide prepackaged UI functionality such as text boxes, data grids,
labels, etc. In addition, a class of Web controls, called Validation controls, are used to
validate user input on a form (usually avoiding a round-trip to the server)
Let us now examine a sample web application. Below is a screenshot of the application:
The user types his name into the text box and clicks on the button labeled ClickMe. The
application displays the text: “Hello World! This is <name>”.
Apart from the configuration files (global.asx, web.config), this application consists of 2 main
files: Webform1.aspx – which is the web forms file, and WebForm1.aspx.cs, which is the code
behind file.
Shown below is the WebForm1.aspx file:
File WebForm1.aspx
1. <%@ Page language="c#" Codebehind="WebForm1.aspx.cs"
AutoEventWireup="false" Inherits="TestWebApp.WebForm1" %>
2. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
3. <HTML>
4. <HEAD>
5. <title>WebForm1</title>
6.
<meta name="GENERATOR" Content="Microsoft Visual Studio .NET
7.1">
An Architectural Introduction to Web Parts and ASP.NET
5
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
<meta name="CODE_LANGUAGE" Content="C#">
<meta name="vs_defaultClientScript" content="JavaScript">
<meta name="vs_targetSchema"
content="http://schemas.microsoft.com/intellisense/ie5">
</HEAD>
<body MS_POSITIONING="GridLayout">
<form id="Form1" method="post" runat="server">
<asp:TextBox id="TextBox1" style="Z-INDEX: 101; LEFT: 192px;
POSITION: absolute; TOP: 72px" runat="server">
</asp:TextBox>
<asp:Label id="Label1" style="Z-INDEX: 102; LEFT: 128px;
POSITION: absolute; TOP: 72px" runat="server">
Name
</asp:Label>
<asp:Button id="Button1" style="Z-INDEX: 103; LEFT: 224px;
POSITION: absolute; TOP: 120px" runat="server"
Text="ClickMe">
</asp:Button>
<asp:Label id="Label2" style="Z-INDEX: 104; LEFT: 120px;
POSITION: absolute; TOP: 184px" runat="server"
Width="272px">
</asp:Label>
</form>
</body>
</HTML>
This form is strictly markup and no code. All the code required for processing the form
appears in a separate file, called the “code-behind” file. This is one of the major innovations in
ASP.NET; it separates the presentation from the logic, thus solving one of the major problems
with ASP – ASP code was hard to maintain because it was interspersed with HTML markup.

Line 1 identifies the code behind file to be webform1.aspx.cs. With this directive, the
framework knows where to look for when it needs event handlers to process the aspx file.

Line 12 begins the <form> tag, but with the runat attribute set to “server”.

Lines 13, 15, 18, and 20 declare the Web controls used on this page. They are,
respectively, a text box, a label, a button, and another label.
For each control, its id is declared, as are some style and layout parameters.
Shown below is the Code-Behind file for this form:
File: WebForm1.aspx.cs
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
using
using
using
using
using
using
using
using
using
using
System;
System.Collections;
System.ComponentModel;
System.Data;
System.Drawing;
System.Web;
System.Web.SessionState;
System.Web.UI;
System.Web.UI.WebControls;
System.Web.UI.HtmlControls;
11. namespace TestWebApp
12. {
13. public class WebForm1 : System.Web.UI.Page
14. {
An Architectural Introduction to Web Parts and ASP.NET
6
15.
16.
17.
18.
protected
protected
protected
protected
System.Web.UI.WebControls.TextBox TextBox1;
System.Web.UI.WebControls.Label Label1;
System.Web.UI.WebControls.Button Button1;
System.Web.UI.WebControls.Label Label2;
19.
20.
21.
22.
private void Page_Load(object sender, System.EventArgs e)
{
// Put user code to initialize the page here
}
23.
24.
25.
26.
27.
override protected void OnInit(EventArgs e)
{
InitializeComponent();
base.OnInit(e);
}
28.
29.
30.
31.
32.
33.
private void InitializeComponent()
{
this.Button1.Click += new
System.EventHandler(this.Button1_Click);
this.Load += new System.EventHandler(this.Page_Load);
}
34.
private void Button1_Click(object sender, System.EventArgs e)
35.
{
36.
string Temp;
37.
Temp = "Hello World!" + "This is " + TextBox1.Text;
38.
Label2.Text = Temp;
39.
}
40. }
41. }
The form is represented by the class WebForm1, which is derived from the Page class in the
System.Web.UI namespace. The “Inherits” of the @Page directive (in line 1 of
WebForm1.aspx file) establishes the binding between WebFrom1 class and the aspx page.

Lines 15 – 18 declares the controls used in the form.
Note that from the perspective of code, these server controls are simply C# classes; these
classes appear in the System.Web.UI.WebControls namespace.

Lines 28 – 33 declares the WebForms1::InitializeComponent method to add a new event
handler for handling “click” events on Button1.

Line 33 adds another event handler for the Load event for this page.

Lines 34 – 39 declares the Button1_Click() method that contains the real logic in our web
application. This method builds the output string by taking the text from TextBox1 inline 38
and setting this string to be the text of Label2. Since Button1_Click() method has been
designated as the event handler for the “click” event on Button1 in line 32, this code gets
invoked when the user clicks the button.
ASP.NET Custom Controls
The ASP.NET server control infrastructure essentially provides a code-reuse mechanism. It
enables the writing of reusable UI entities which you can incorporate in a page. At runtime, the
control provides ASP.NET with HTML describing its appearance.
ASP.NET ships with a rich library of server controls. These controls address the needs of
many common web design tasks. Rich as the control library is, there are still cases where a
An Architectural Introduction to Web Parts and ASP.NET
7
web developer is unable to find a control that precisely suits her purposes. It is desirable
therefore, there be a way to create custom, reusable UI objects that developers can use in
Web Forms.
To address such situations, ASP.NET provides the ability to write your own controls. They fall
into two broad categories:

User Controls provide a simple and fast method for reusing your presentation code. They
are simply HTML or ASP.NET code saved in a file with an .ascx extension. However, you
cannot directly call a user control (as .aspx pages can). You have to include them within
an aspx page. User controls can contain almost any element that a web forms page can
contain. User controls are an evolution of Server Side Includes (SSI) in ASP.

Custom Controls are .NET components which can produce HTML to render themselves
in Web Forms.
This section will focus on the Custom Controls. This is because a Web Part is an ASP.NET
custom control.
An ASP.NET server control is a class that derives directly or indirectly from
System.Web.UI.Control. The following two classes are the base classes for ASP.NET server
controls:

System.Web.UI.Control: This class defines the properties, methods, and events common
to all ASP.NET server controls. It does not have any user interface (UI) specific features.

System.Web.UI.WebControls.WebControl: This class derives from Control and provides
additional properties and methods for UI functionality (such as ForeColor, BackColor,
Font, BorderStyle, etc). In fact, most of the built in ASP.Net server controls derive from
this class.
Shown below is the code for a simple ASP.NET custom control.
1.
2.
3.
4.
using
using
using
using
System;
System.Web.UI;
System.Web.UI.WebControls;
System.ComponentModel;
5. namespace MyCustomControls
6. {
7.
[DefaultProperty("Greeting"),
ToolboxData("<{0}:ComputerName
runat=server></{0}:ComputerName>")]
8.
public class ComputerName : System.Web.UI.WebControls.WebControl
9.
{
10.
private string _Greeting;
11.
[Bindable(true),
Category("Appearance"), DefaultValue("")]
12.
public string Greeting
13.
{
14.
get
15.
{
16.
return _Greeting;
17.
}
18.
set
19.
{
20.
_Greeting = value;
21.
}
22.
}
23.
protected override void Render(HtmlTextWriter output)
24.
{
25.
output.Write("<font> "+ this.Greeting + "<br>" +
An Architectural Introduction to Web Parts and ASP.NET
8
"The name of this server is " +
System.Windows.Forms.SystemInformation.ComputerName
+
"</font>");
26.
}
27.
}
28. }
The name of the control is “ComputerName”; this control has one property, called Greeting.
The control gets the name of the server and appends it to the Greeting, and produces HTML
to display this text. For example, if the server name is “MyServer” and Greeting is set to the
string “Hello”, then it produces the text: “Hello. The name of this server is MyServer”

Line 5 declares the namespace, “MyCustomControls”. Every control (indeed, every .NET
component) belongs to a namespace.

Line 7 defines the design-time and run-time metadata for the control, required for (among
other things) displaying the control at design time, data binding, displaying property
sheets, etc.

Line 8 declares the class named “ComputerName” for our control. A custom control is
implemented as a class. This class is typically derived from the WebControl class
provided by the framework.

Line 11 defines the properties for the control. At design time, the property sheet editor in
Visual Studio.net 2003 requires metadata for the property, such as its category, default
value, etc.

Lines 12 – 22 define the accessors for the Greeting property of our control.

Lines 23 – 26 declares the Render method (which is an overridden method of the
WebControl class) used to produce HTML.

Line 25 uses an HtmlTextWriter object called “output” to produce HTML tags. This method
takes the “Greeting” property and concatenates it with the ComputerName property of the
SystemInformation class and produces this string, along with some HTML tags.
Below is an aspx page that uses this control; since this control doesn’t expose any events,
there is no need for writing event handlers in the code-behind file.
1. <%@ Page language="c#" Codebehind="WebForm1.aspx.cs"
AutoEventWireup="false" Inherits="TestWebApp.WebForm1" %>
2. <%@ Register TagPrefix="cc1" Namespace="MyCustomControls"
Assembly="MyCustomControls" %>
3. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
4. <HTML>
5.
<HEAD>
6.
<title>WebForm1</title>
7.
<meta content="Microsoft Visual Studio .NET 7.1"
name="GENERATOR">
8.
<meta content="C#" name="CODE_LANGUAGE">
9.
<meta content="JavaScript" name="vs_defaultClientScript">
10.
<meta content="http://schemas.microsoft.com/intellisense/ie5"
name="vs_targetSchema">
11. </HEAD>
12. <body MS_POSITIONING="GridLayout">
13.
<form id="Form1" method="post" runat="server">
14.
<cc1:ComputerName id="ComputerName1" style="Z-INDEX: 105;
LEFT: 160px; POSITION: absolute; TOP: 248px"
runat="server" Height="22px" Greeting="Welcome">
15.
</cc1:ComputerName></form>
An Architectural Introduction to Web Parts and ASP.NET
9
16. </body>
17. </HTML>

Line 2 uses the @Register directive. This contains the namespace and assembly name
for the custom control. It uses the TagPrefix attribute to prevent name collisions. For
instance, if somebody else creates a control whose name is also “ComputerName”, then
these two controls are distinguished by the different tag prefixes (such as cc1 and cc2).

Line 14 contains the markup for inserting the control into the page. The syntax and
semantics of this markup is the same for a custom control and a built-in control (see the
previous section for details).
When you run this page with the Greeting property set to “Welcome”, the output looks like this:
An Architectural Introduction to Web Parts and ASP.NET
10
Creating Custom Web Parts
As mentioned before in this document, Web Parts are ASP.NET custom controls. Microsoft
Visual Studio.net 2003 is an excellent environment for building and debugging ASP.NET
custom controls. Developers can use it for building Web Parts as well.
There are two project templates you can use when building a Web Part using Microsoft Visual
Studio.net 2003:

Use the Web Control Library project: This project template comes with Microsoft Visual
Studio.net 2003 which developers can use for building any ASP.NET controls, including
Web Parts.

Use the Web Part Library project: This project template is available as a free download
from Microsoft that is optimized for building Web Parts.
In the rest of this section, we will use the Web Part Library project template. There are several
advantages to using the Web Part Library template:

Automatically adds a reference to the Microsoft.SharePoint.dll file, which is the assembly
that contains the set of classes required to build Web Parts.

Creates a Web Part class file.

Creates a Web Part description (.dwp) file.

Creates a Web Part manifest file, which is an XML file containing metadata used by
stsadm.exe during the deployment of Web Parts.

Adds new instances of the above files to the project by a simple right click; you can also
add consumer and provider Web Part files and Tool Part files to the project.
Note: each of the above should be manually accomplished when using the Web Control
Library project.
Installing the Web Part Library Template
The Web Part Library template is available for download at
http://microsoft.com/downloads/details.aspx?FamilyId=14D5D92F-C3A6-407C-AAD7B8C41A4991BE&displaylang=en.
To add the Web Part Library template to your Microsoft Visual Studio.net 2003 installation,
follow these steps:
1. Download the Web Part Library templates and run the executable.
2. The Setup Wizard starts. Click Next to install the package.
3. Select the programming languages for which you want to install the templates and
then click Next.
4. In the text box provided, type the location of the Windows SharePoint Services
assembly in the file system and click Next.
5. The Confirm Installation page appears. Click Next to continue.
6. The Installation Complete page appears. Click Close to close the Setup Wizard.
An Architectural Introduction to Web Parts and ASP.NET
11
Creating and Deploying a Web Part
To create a basic Web Part, follow these steps:
1. Create a new project in Microsoft Visual Studio.net 2003 based on the Web Part
Library template.
2. Write code for the Web Part.
3. Strongly name the Web Part.
4. Create a Web Part description file (dwp).
5. Copy the Web Part assembly and the dwp file into the web application directory on the
machine running Windows SharePoint Services.
6. Identify the Web Part as a safe control.
7. Import the Web Part into a Web Part Page or put the Web Part into the virtual server
library.
The details of each of these steps are beyond the scope of this paper; we refer the reader to
the following white papers:

“A Developer’s Introduction To Web Parts”

“Packaging and Deploying Web Parts for Windows SharePoint Services”
Both are available for download at
http://msdn.microsoft.com/library/default.asp?url=/downloads/list/SharePoint.asp.
In this paper, we will examine the sample code for a simple Web Part and look at a dwp file
that will accompany it.
Example: A Sample Web Part
The following code illustrates a simple Web Part which has a text box and a button; when you
click on the button, the string in the text box is appended to the title of the Web Part.
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
using
using
using
using
using
using
using
using
using
using
System;
System.ComponentModel;
System.Web.UI;
System.Web.UI.WebControls;
System.Xml.Serialization;
Microsoft.SharePoint;
Microsoft.SharePoint.Utilities;
Microsoft.SharePoint.WebPartPages;
System.Web.UI.HtmlControls;
System.Runtime.InteropServices;
11. namespace WebPartLibrary1
12. {
13.
[DefaultProperty("Text"),
ToolboxData("<{0}:WebPart1 runat=server></{0}:WebPart1>"),
XmlRoot(Namespace="WebPartLibrary1")]
14.
public class WebPart1 :
Microsoft.SharePoint.WebPartPages.WebPart
15.
{
16.
private const string defaultText = "New Web Part";
17.
private string text=defaultText;
18.
19.
20.
// declare HTML controls used by this web part
HtmlButton _myButton;
HtmlInputText _myTextBox;
An Architectural Introduction to Web Parts and ASP.NET
12
21.
// Event handler for _myButton control; it gets the string in
// the text box & appends it to the custom property "Text" &
// sets this as the title of the web part
public void _myButton_Click (object sender, EventArgs e)
{
this.Title = _myTextBox.Value + "'s " + this.Text;
}
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
[Browsable(true),Category("Miscellaneous"),
DefaultValue(defaultText),
WebPartStorage(Storage.Personal),
FriendlyName("Text"),Description("Text Property")]
public string Text
{
get
{
return text;
}
set
{
text = value;
}
}
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
// override Web.UI.Controls.CreateChildControls method
protected override void CreateChildControls()
{
// create _myButton control and add event handler
_myButton = new HtmlButton();
_myButton.InnerText = "Add your Name to title";
_myButton.ServerClick += new EventHandler(_myButton_Click);
Controls.Add(_myButton);
_myTextBox = new HtmlInputText();
_myTextBox.Value = "";
Controls.Add(_myTextBox);
}
50.
51.
52.
53.
54.
55.
56.
}
57. }
/// Render this Web Part to the output parameter specified.
protected override void RenderWebPart(HtmlTextWriter output)
{
_myTextBox.RenderControl(output);
_myButton.RenderControl(output);
}
You may notice that this code looks like the code shown for ASP.NET the custom control in a
previous section. This should come as no surprise because Web Parts are ASP.NET custom
controls.
However, there exist several differences.
The first is in Line 14:

The Web Part class derives from Microsoft.SharePoint.WebPartPages.WebPart class, as
opposed to a stock ASP.NET control, which derives from one of System.Web.UI.Control
or System.Web.UI.WebControls.WebControl.
An Architectural Introduction to Web Parts and ASP.NET
13

However, the WebPart class itself derives from System.Web.UI.Control class and this is
what ties a Web Part into the entire ASP.NET control infrastructure. To the features of a
stock ASP.NET control, the Web Part class adds the following:

Creates the title bar, border etc., around the control, which users can customize by
setting properties and applying themes.

Handles interactions with the WebPartPage and WebPartZone classes to support
adding, moving, hiding, deleting, connecting, and personalizing Web Parts on a page.
This is what “plugs” a Web Part into the Windows SharePoint Services infrastructure.

Provides a set of common properties such as Title, Height, Width, FrameState, etc.
The second difference is in Line 51.

When rendering an ASP.NET control, you typically override the Render method of the
base class; however, the WebPart class has sealed the Render method. Developers
should override the special RenderWebPart method provided by the WebPart class.
The rest of the code show above is straightforward ASP.NET control code:

Lines 19 and 20 create HTML text controls used in this web part (an input text and a
button control)

Lines 21 - 25 define the event handler for the button click event. This handler simply takes
the value in the text box, appends this to the value of the custom property called “Text”,
and sets this as the new title. Thus if the Text Property is “New Web Part” and the string
“Ralph” is typed in the input text box, then the button click will set the new title of the Web
Part to “Ralph’s New Web Part”.

Lines 26 - 37 define the accessors for the Text custom property.

In lines 38 - 49, we override the CreateChildControls method of the base class to
initialize the controls in this Web Part. The controls are added to the collection of child
controls for this Web Part class. Also, we add the click event handler defined in lines 2125 to the HtmlButton’s ServerClick event.
Rendering the Web Part at Design Time
FrontPage 2003 provides a design time preview of Web Parts on a Web Part Page at design
time. The developer can exercise precise control over this design time rendering. This is done
by implementing the IDesignTimeHtmlProvider interface in the Web Part. This interface has
a single method, called GetDesignTimeHtml, which returns the HTML string used to render
the Web Part. Design tools such as FrontPage 2003 which leverage Windows SharePoint
Services, check to see if this interface is implemented; if it is, then they call the
GetDesignTimeHtml method for rendering. Otherwise, they use the default rendering for that
Web Part.
Creating a Web Part Description File (dwp)
The Windows SharePoint Services infrastructure uses the Web Part description file which
contains metadata about the Web Part.
Shown below is the dwp file for the Web Part created in the previous section:
1.
2.
3.
4.
5.
<?xml version="1.0" encoding="utf-8"?>
<WebPart xmlns="http://schemas.microsoft.com/WebPart/v2" >
<Title>New Web Part</Title>
<Description>WebPart1.</Description>
<Assembly>WebPartLibrary1, Version=1.0.0.0, Culture=Neutral,
An Architectural Introduction to Web Parts and ASP.NET
14
6.
7.
PublicKeyToken=334fd085a590fb9f</Assembly>
<TypeName>WebPartLibrary1.WebPart1</TypeName>
</WebPart>
As you can see, the dwp is an XML file. The root element of this file is the <WebPart>
element, and it contains, among others, the following tags:

<Title> specifies the default title of the Web Part

<Description> specifies the pop up description for the Web Part which FrontPage 2003
and the browser displays.

<Assembly> specifies the name of the assembly that contains the implementation for this
Web Part.

<TypeName> specifies the class within the assembly which implements the Web Part.
This is required because an assembly can implement more than one Web Part and/or
other ASP.NET controls. Notice how the value of the TypeName tag corresponds to the
namespace declaration (line 11) and class declaration (line 14) shown in the previous
section.
Note You can export dwp files in FrontPage 2003, using Tools/Save Web Part to/File…
Deploying the Web Part
You can deploy a Web Part in two different ways:

Place it in one of the Windows SharePoint Services Web Part Libraries – the virtual server
library, site library, or the online library. This makes it available to all pages in the site.

Import it into a specific page. This makes the Web Part available only to that page and it
will not appear in any gallery.
Deploying in a Windows SharePoint Services Library
Before deploying the Web Part into a Windows SharePoint Services Library, you must build a
Web Part Package. A Web Part Package is a cabinet (.cab) file that contains the following
items:

Manifest.xml

.dwp files
Note: When using the Web Part Library template for Microsoft Visual Studio.net
2003, it automatically creates the manifest.xml and dwp files for you.

Web Part assemblies: one or more .NET assemblies and are the result of building your
Web Part Library solution

Class resource files contain bitmaps and other resources required for your Web Part.
The details of the structure of manifest.xml, and the modalities of building a CAB file are
outside the scope of this paper. For details, please see the white paper entitled “Packaging
and Deploying Web Parts for Microsoft Windows SharePoint Services” at
http://msdn.microsoft.com/library/default.asp?url=/library/enus/dnspts/html/SharePoint_DeployingWebParts.asp.
Once you have a CAB file, you can use the stsadm.exe tool on the server running Windows
SharePoint Services to add the Web Part to the virtual server library. The typical command
line for using stsadm.exe to add a Web Part looks like below:
stsadm.exe –o addwppack –filename path_to_CAB_file
An Architectural Introduction to Web Parts and ASP.NET
15
The stsadm.exe tool is typically available in
<drive>:\Program Files\Common Files\Microsoft Shared\web server extensions\60\BIN
For more details on using stsadm.exe tool, see the “Packaging and Deploying Web Parts for
Microsoft Windows SharePoint Services” white paper referenced above.
Using the stsadm.exe tool deploys the Web Part into the virtual server library and you can use
with FrontPage 2003 or the Web Browser interface. You can make any Web Part in the virtual
server library available in the site library. For more details on managing Web Parts in these
libraries, see “FrontPage 2003: Working with Web Part Libraries”.
Importing the Web Part into a Specific Page
You can also simply import a Web Part onto a page. The process of import does not add the
Web Part to the Virtual, Site, or Online libraries; it is just available on a given page. Before you
can import a Web Part onto a page, you must perform the following tasks on the machine
running Windows SharePoint Services:
1. Copy the Web Part assembly to the <drive>:\inetpub\wwwroot\bin folder.
2. Register the Web Part as a safe control. Do this by editing the web.config file, located
in the <drive>:\inetpub\wwwroot folder. For our sample Web Part, this involves adding
the following lines under the <configuration>/<SharePoint>/<SafeControls> block:
<SafeControl Assembly="WebPartLibrary1, Version=1.0.0.0,
Culture=Neutral, PublicKeyToken=334fd085a590fb9f"
Namespace="WebPartLibrary1" TypeName="*" Safe="True" />
3. Make the dwp file for the Web Part available for the users that want to import this Web
Part.
Assuming these steps are performed, the Web Part can be imported onto a page using
FrontPage 2003 using the following steps:
1. Bring up the Web Parts task pane: View/Taskpane and select “Web Parts” from the
dropdown list of available task panes.
2. Under Add Web Parts, click Import.
3. Browse to or type in the location of the .dwp file for the Web Part you want to import.
4. Click “Upload”. The Web Part now appears on the task pane.
You can now drag and drop the part onto the page.
Using the Web Part in FrontPage 2003
In this section, we will assume that our sample Web Part is available in the Virtual Server
Library of the Windows SharePoint Services installation.
Using this Web Part is no different from using any other Web Part. To use a Web Part, follow
these steps:
1. Open the site you wish to work with in FrontPage 2003. For the purposes of this
section, we will assume the site is located at the URL: http://myserver/my-workgroup.
2. Click on Data/Insert Web Parts to open the Web Parts taskpane in FrontPage 2003.
3. Click on Virtual Server Gallery to display the available Web Parts. You should see
the sample Web Part available there; its title is New Web Part.
Below is a screenshot of the task pane:
An Architectural Introduction to Web Parts and ASP.NET
16
4. Drag and drop this Web Part into an appropriate zone in your web page. For the
purposes of illustration, let us assume that we have dragged the Web Part into the
default.aspx page of a Windows SharePoint Services site created using the Team
Site template.
5. Save the page and run it in the browser by typing the appropriate URL. We have used
the URL http://myserver/default.aspx.
6. Locate the Web Part you just added (it should be titled “New Web Part”).
7. Type your name in the text box, and click on Add your Name to title button. The title
will change to (assuming the name you typed was Murali) “Murali’s New Web Part”.
Below is a screenshot of this:
An Architectural Introduction to Web Parts and ASP.NET
17
Recall that this Web Part has a custom property called Text. Refer to the Web Part code in
“Example: A Sample Web Part”.
Note the following:

Line 22 – 25 specifies that the event handler for the button click event on the Add your
Name to title button take the value of the Text property, append it to the string typed in
the text field, and set this as the value of the title.

Lines 26 – 37 implements the custom property and specifies that this property has to be
put under the category “Miscellaneous”.
To manipulate this property in FrontPage 2003, follow these steps:
1. In the Web Part properties dialog box, notice the new category called Miscellaneous.
Expanding this category shows a property called Text and a text box to enter the
value for it. FrontPage 2003 automatically displays a text box to enter the value of this
property because the data type of this property is string (line 27 of the code in
“Example: A Sample Web Part”)
2. Type “Fancy Web Part” as the new value of this property.
3. In FrontPage 2003, right click on our example Web Part and select Web Part
Properties in the pop-up menu.
Below is a screenshot of how this should look:
An Architectural Introduction to Web Parts and ASP.NET
18
4. Click OK, save changes and run the page in the browser by typing the appropriate
URL. We have used the URL http://myserver/default.aspx.
5. Locate our example Web Part (it title should be “New Web Part”).
6. Type your name in the text box, and click on Add your Name to title button. The title
will change to (assuming that the name you typed was Murali) “Murali’s Fancy Web
Part”.
Below is a screenshot of this:
Note By default, the custom properties you create and specify as browsable are automatically
displayed in the default property pane, making their use transparent to the user. If the default
property pane isn't rich enough in functionality, you can create a custom user interface called a
ToolPart to manipulate your custom properties. For information on creating a ToolPart, see the
http://msdn.microsoft.com/library/default.asp?url=/library/enAn Architectural Introduction to Web Parts and ASP.NET
19
us/spptsdk/html/CreateWPCustomProperties.asp.
An Architectural Introduction to Web Parts and ASP.NET
20
Conclusion
ASP.NET is part of the .NET Framework and is the core technology for developing web
applications and XML Web Services. ASP.NET is a compiled, .NET-based environment; you
can author applications in any .NET compatible language, including Visual Basic .NET, C#,
and JScript .NET. Additionally, the entire .NET Framework is available to any ASP.NET
application. Developers can easily access the benefits of these technologies, which include
the managed common language runtime environment, type safety, inheritance, and so on.
.NET developers write Web Parts using Visual Studio.NET 2003.
The Web Part Framework is the basis for extensibility in Windows SharePoint Services. It
allows developers to write custom components that plug into the SharePoint infrastructure by
encapsulating web services and enterprise data as Web Parts. Web Part Pages are special
ASP.NET pages which are the building blocks of a Windows SharePoint Services based data
driven web site. Web page authors can use Microsoft FrontPage 2003 to leverage Windows
SharePoint Services and use the Web Part Framework to easily build data driven web sites
using a library of readily available web parts. Microsoft FrontPage 2003 integrates closely with
Windows SharePoint Services and is the easiest and the most powerful web site design tool
that enables creation of a new category of collaborative, scalable, data driven web sites.
An Architectural Introduction to Web Parts and ASP.NET
21
References
FrontPage 2003: Overview of Web Parts Framework
FrontPage 2003: Working with Web Part Libraries
FrontPage 2003: Customizing Web Parts
FrontPage 2003: Connecting Web Parts
FrontPage 2003: Working with Web Part Pages
FrontPage 2003: Working with the Data View Web Part
Other Microsoft Resources
Microsoft FrontPage 2003 Customization Kit Web:
http://www.sharepointcustomization.com
Microsoft FrontPage Web site:
http://www.microsoft.com/frontpage/default.htm
Microsoft FrontPage Add-in Center:
http://www.microsoft.com/frontpage/downloads/addin/default.asp
Microsoft SharePoint Products and Technologies:
http://www.microsoft.com/sharepoint/default.asp
SharePoint Products and Technologies Web Component Directory:
http://www.microsoft.com/sharepoint/downloads/components/default.asp
An Architectural Introduction to Web Parts and ASP.NET
22
The information contained in this document represents the current view of Microsoft Corporation on the issues discussed as of the date
of publication. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the
part of Microsoft, and Microsoft cannot guarantee the accuracy of any information presented after the date of publication.
This white paper is for informational purposes only. MICROSOFT MAKES NO WARRANTIES, EXPRESS OR IMPLIED, IN THIS
DOCUMENT.
Complying with all applicable copyright laws is the responsibility of the user. Without limiting the rights under copyright, no part of this
document may be reproduced, stored in, or introduced into a retrieval system, or transmitted in any form or by any means (electronic,
mechanical, photocopying, recording, or otherwise), or for any purpose, without the express written permission of Microsoft Corporation.
Microsoft may have patents, patent applications, trademarks, copyrights, or other intellectual property rights covering subject matter in
this document. Except as expressly provided in any written license agreement from Microsoft, the furnishing of this document does not
give you any license to these patents, trademarks, copyrights, or other intellectual property.
© 2001 Microsoft Corporation. All rights reserved.
The example companies, organizations, products, domain names, e-mail addresses, logos, people, places, and events depicted herein
are fictitious. No association with any real company, organization, product, domain name, e-mail address, logo, person, place, or event
is intended or should be inferred.
Microsoft, FrontPage, and SharePoint are either registered trademarks or trademarks of Microsoft Corporation in the United States
and/or other countries.
An Architectural Introduction to Web Parts and ASP.NET
23