devxlogo

Work Web Part Magic Inside of ASP.NET

Work Web Part Magic Inside of ASP.NET

icrosoft released SharePoint to the market back in 2000/2001 and, in doing so, began a shift in perception about how Web applications are built. The change was slow at first and has yet to take over the way we build applications completely; however, the change has started.

Rather than the old way of building page after page of copied content, this change moves toward a development model for Websites that focuses on reusable, connectable, and user-configurable components that are assembled quickly in different ways to create the solutions that business users need. In the Sharepoint world, these reusable components are called Web parts.

Now, ASP.NET 2.0 has integrated Web parts and the core concepts behind it: the idea that you build applications from components and not as page after page of similar functionality. This core approach to software development has the potential to accelerate your business by allowing users to assemble their own software solutions?solutions that normally they would not be able to create on their own.

In this article you’ll learn the core concepts behind an ASP.NET 2.0 Web part, how this structure relates to (and is better than) Windows SharePoint Services 2.0 (and Microsoft Office SharePoint Portal Server 2003), and how to build your own Web part page.

What is a Web Part?
At its most basic level a Web part is a Web control (or server control if you prefer) that supports an extra set of methods and properties. These methods and properties are designed to allow you to easily manipulate configuration data and appearance/UI elements programmatically.

In SharePoint a Web part had to derive from the Microsoft.SharePoint.WebParts.WebPart class. In ASP.NET 2.0 the key requirement is that the Web control that you want to use as a Web part implements the System.Web.UI.WebControls.WebParts.IWebPart. If you derive from System.Web.UI.WebControls.WebParts.WebPart the IWebPart interface is already supported for you. So you can build ASP.NET 2.0 Web parts just as you would have built a SharePoint Web part?by deriving from a base class.

ASP.NET 2.0 has a cool twist: It allows you to use any Web control as a Web part even if the Web control does not support the IWebPart interface natively. The ASP.NET 2.0 framework wraps the Web control in a generic wrapper and uses that wrapper to expose the necessary interface.

In terms of the functionality that a Web part can provide, there is little limit to the applications for the technology. Just as Web controls themselves are flexible, so too are Web parts. The ability for the business user to compose a page with a set of reusable components transfers the power that was once solely in the developers hands into the hands of the business user. Once a library of components is built up around internal business needs, the business users can begin to assemble their own pages.

ASP.NET 2.0 is fundamentally built on the premise that developers write code. So rather than a pre-made solution for adding Web parts to a page, ASP.NET 2.0 provides a set of building blocks that you can use to create a component-based model for building user interfaces?a model that leverages Web parts.
For instance, if the developer creates speedometer controls around the key performance indicators of the business, the business user can assemble a dashboard. If instead, the developer creates a set of search components that allow back-end ERP systems to be searched, an advanced search screen can be created which allows users to search across the entire enterprise from one page.

An HR application might include Web parts that talk about payroll information and might include links to the employee handbook, online training sites, and other components that are not individually complicated but can be powerful together.

Nearly every site or portal that you’ve ever seen demonstrated in Microsoft SharePoint can now be created with ASP.NET. While many cases expose SharePoint’s built-in power of lists and document libraries, there are many others that demonstrate little more than the ability to create a central focal point of information through the use of Web parts.

Making a Web Part Work
In SharePoint using a Web part is the native way that things operate. There is no setup, no special configuration settings, and nothing to do except drop the Web part on the page in a Web part zone. However, with ASP.NET 2.0 there is no default understanding on every page to connect Web parts to the core infrastructure. ASP.NET 2.0 is fundamentally built on the premise that developers write code. So rather than a pre-made solution for adding Web parts to a page, ASP.NET 2.0 provides a set of building blocks that you can use to create a component-based model for building user interfaces?a model that leverages Web parts. There are two essential components to each page you create.

The most important component to a Web part page is the WebPartManager control. This control must appear once and only once on every page that will have Web parts. It must occur before any other element related to Web parts. It is responsible for coordinating control throughout the page. Even though it will display in design mode in Visual Studio it does not render any output to the page during runtime. It’s simply there to be the “traffic cop” for the Web parts and the infrastructure.

The second essential item is the WebPartZone. The Web part zone is the container for the Web parts. Every Web part on the page should be placed in a Web part zone.

In addition to these two required components of the page you’ll also need to ensure that personalization is set up on the site so that ASP.NET has a database in which to store the configuration of the Web parts.

Making Web Parts Valuable
Although technically, there are only two requirements to make Web parts work, they aren’t the only useful components of the framework. “Zones” are containers for other controls. The ASP.NET framework defines three types of Zones. The first type is the required WebPartZone, discussed in the last section. There are two others that you will likely find useful:

  • EditorZone?This zone is responsible for holding the editor parts, which allow for the editing of appearance (AppearanceEditorPart), behavior (BehaviorEditorPart), layout (LayoutEditorPart), and custom Web part properties (PropertyEditorPart). This zone is essential if you want users to be able to personalize Web parts?either for all users of the current page or just for themselves.
  • CatalogZone?This zone is responsible for holding the catalog parts, which allow a user to add Web parts to a page. The three catalog parts are: PageCatalogPart, which allows the user to add Web parts to the page that were previously on the page but were closed; DeclarativeCatalogPart, which allows the developer to create a list of Web parts that can be added to the page; and ImportCatalogPart, which allows users to import Web part configuration from another site or location. The catalog zone is essential if you want the user to be able to add Web parts to the page.

In a typical portal type environment you’ll place an editor zone, with the appropriate editor parts above a catalog zone, which has a set of catalog parts in it. When ASP.NET 2.0 renders the page these sections will be invisible until the page enters the appropriate mode. The way that SharePoint implements these zones is along the right side in a bar that appears when the page is in an editing or maintenance mode.

Creating a Web Site to Host your Web Part
Before creating your Web part it is helpful to have a Website that you can add it to. In this section I’ll guide you through the step-by-step process of creating a Web page that you can use to host your Web parts and test that they are working. If you don’t have an IIS virtual server setup, you’ll need to set one up. Once you have a Website to host your project, you’re ready to start:

  1. Open Visual Studio.
  2. Select Create Web Site? from the Start Page.
  3. From the Language drop down, select the language for your project. In this example I’m using C#, so if you want to follow along select C#.
  4. Select ASP.NET Web Site from the templates (see Figure 1).
  5. In the location box, enter the location for your Web server. (The figures in this article will reflect http://localhost:83/WebParts.)



    Figure 1. Fresh Part Start: In this dialog you take the first step in creating the new Website for your Web part pages.
    ?
    Figure 2. Debug?: You’ll be given the option to create a web.config with debugging turned on.

  6. Click OK.
  7. Click the Design tab to enter design mode of the default.aspx page.
  8. In the toolbox window (select View ?> Toolbox if it is not already displayed) expand the Web parts section and drag the WebPartManager to the page.
  9. From the toolbox in the WebParts group, select WebPartZone and drag it into the page.
  10. Press F5 to run the Website.
  11. Answer ‘Yes’ when prompted to create a web.config and enable debugging (see Figure 2).(Note: This process will cause Visual Studio, IIS, and ASP.NET to complete a series of steps that require your server to be configured correctly. If for any reason your server isn’t configured correctly you’ll see an error page that will advise you how to resolve the configuration options.)
  12. When your blank page comes up, close Internet Explorer; you’re about to create your new Web part.

Create Your Web Part

  1. Click the solution in Solution Explorer.
  2. Right-click the solution, select Add, and finally select New Project.
  3. Expand the Visual C# item in the Project types pane.
  4. Click the Windows item under Visual C# in the Project types.
  5. Click the Web Control Library option in the templates section.
  6. In the name textbox, enter a name for the Web control. In this example, we’ll call the library SampleWebParts.
  7. When the WebCustomControl1.cs file opens add a new using statement: “using System.Web.UI.WebControls.WebParts.”
  8. Change the base class for WebCustomControl1 from WebControl to WebPart.
  9. In the solution explorer pane, right-click the WebCustomControl1.cs file and give it the name of TextWebPart.
  10. When prompted to rename all references, click the Yes button.
  11. Update the class level ToolboxData attribute changing both (start and end) WebCustomControl1 references to TextWebPart.
  12. Above the Text property add the following attributes:
    • [WebBrowsable]
    • [Personalizable]
    • [WebDisplayName(“Text to Display”)]
    • [WebDescription(“The text the Web part will display”)]
  13. Build the solution (Ctrl-Shift-B) to make sure that your Web part compiles.

Add the Web Part to the Page

Figure 3. Thou Art Web Part: A bare bones Web part is displayed on the ASP.NET Web part page created in this article.

Adding the Web part page is a two-part process. The first part of the process adds the Web part to the declarative catalog; the second part adds the Web part to the page. Both steps are covered in the following process:

  1. In Design view on the default.aspx page, drag the TextWebPart from the SampleWebPartsComponents into the Web part zone.
  2. Switch to source view on the default.aspx page. In the SampleWebParts:TextWebPart tag add a Title attribute with something in it such as “Web Part Title”) and a Text attribute with something in it such as “This is a test.”
  3. Press F5 to run your Web application and Web part.
  4. You should see your Web part with the title and text you specified. Figure 3 shows the result of the page when put together.

Web Parts are not inherently complicated but are inherently powerful. In this article you learned what ASP.NET Web parts are, how they relate to SharePoint Web parts, how they work, and created a functioning Web part.

devxblackblue

About Our Editorial Process

At DevX, we’re dedicated to tech entrepreneurship. Our team closely follows industry shifts, new products, AI breakthroughs, technology trends, and funding announcements. Articles undergo thorough editing to ensure accuracy and clarity, reflecting DevX’s style and supporting entrepreneurs in the tech sphere.

See our full editorial policy.

About Our Journalist