Internet Explorer WebControls

This article provides a general overview of Windows Internet Explorer WebControls, which are a powerful collection of ASP.NET server controls. The WebControls implement a single-source authoring solution for four popular UI elements: MultiPage, TabStrip, Toolbar, and TreeView.

The WebControls deliver content that renders in all commonly used browsers, while taking advantage of powerful features supported by Microsoft Internet Explorer 5.5 or later versions. The WebControls provide an authoring solution with widespread reach, by delivering HTML 3.2 compatible content to downlevel browsers (Internet Explorer 5.01 or earlier or a browser other than Internet Explorer). ASP.NET Web forms detect the client browser capabilities and include Dynamic HTML (DHTML) behaviors in the Web pages downloaded to uplevel browsers (Internet Explorer 5.5 or later). The objects exposed by the DHTML behaviors and the ASP.NET controls are presented in the Internet Explorer WebControls Reference.

This document includes the following sections.

Setup

To obtain a copy of these controls for installation, see the Internet Explorer WebControls Download page. Before attempting to install the WebControls, it is important review the Prerequisites section.

Prerequisites

In order to gain the most benefit from this article, the reader should have some familiarity with ASP.NET controls. Developers who have prior experience in using or developing Active Server Pages (ASP) custom components will also find the main concepts behind using the WebControls familiar.

Authoring with WebControls

To host and develop Web pages with the WebControls, either the .NET Framework SDK or Visual Studio .NET products must to be installed on the hosting computer. Both of these products install ASP.NET as a part of the setup process. After ASP.NET is running on your computer, the WebControls can be installed. To install the controls on your computer, see the Internet Explorer WebControls Download page.

There are a few common ground rules and recommendations that apply to authoring Web Forms pages with all of the WebControls, and these are discussed in Authoring Web Forms with the WebControls.

Introduction

In order to fully appreciate what WebControls can do to improve and streamline the Web development process, it's worth considering some of the major problems that currently challenge Web developers.

The Web Developer's Problem

Several different browsers are now being used to surf the Internet, and the number of browser types and versions is increasing continuously. This has become a major challenge for Web developers because each browser has a distinct set of features and capabilities. The complex maze of browser incompatibilities has forced many developers with limited resources to write Web pages in HTML 3.2 because support for this standard is fairly widespread. Although HTML 3.2 provides a basic common denominator, premium Web sites have to deliver more sophisticated user experiences than HTML 3.2 alone can support.

In order to provide premium Web content, many Web development teams have developed multiple solutions for their Web sites. This approach has delivered an improved user experience for the more capable browsers, but all too often, at great expense. Many development teams, and most individuals, simply do not have the resources to develop multiple solutions for their Web sites.

This scenario has resulted in the need for more intelligent authoring technologies that streamline and simply the process of developing content for a wide range of browsers.

Solutions for the Web Developer

ASP.NET is designed to solve, or at least greatly simplify, many of the challenges facing Web developers. One of the most powerful features of the ASP.NET platform is that it supports custom server controls. ASP.NET controls can be used to define custom XML elements.The WebControls implement several custom elements for authoring UI.

The WebControls are custom ASP.NET server controls. These controls detect the client browser type and version. The WebControls deliver a wide-reaching solution to downlevel browsers, and enhanced client content is sent to uplevel browsers.

Web pages using DHTML behaviors are delivered to uplevel browsers; this type of content updates dynamically on the client, providing a superior user experience. In downlevel browsers, user interactions post updates back to the ASP.NET controls on the Web server. The server-side WebControls refresh the rendering and keep track of the state of the Web page. The Web pages downloaded by the uplevel browsers are richer because they incorporate numerous enhancements, including extensive customization, keyboard input, page rendering quality, and other enhancements to the page functionality. In the uplevel client pages, the number of server roundtrips is reduced significantly because the client browser processes most of the user-interaction and rendering updates locally.

By providing a single-source solution, the WebControls can reduce development costs and simplify many authoring tasks significantly. Also, authoring with the WebControls enables authors to take advantage of the advanced capabilities in Internet Explorer 5.5 or later versions with no additional effort or cost.

ASP.NET Controls

To provide some context for the WebControls, the other types of ASP.NET controls are reviewed here.

  • Intrinsic

    Intrinsic controls create HTML-style elements on the client. These are intelligent controls that detect the browser type and automatically maintain state.

  • List

    List controls automatically produce lists of all kinds on the client. In conjunction with server-side data binding, they can also populate lists with data from databases and XML files and can be written with a few lines of code.

  • Rich

    Rich Controls output client-side HTML and, in some cases, client-side script as well. These controls are used to create more complex interface elements on the client. Examples of ASP.NET controls include the Calendar and the AdRotator. Rich controls detect the browser type and version and create the corresponding HTML to render correctly in the client.

  • Validation

    Validation controls are nonvisible controls; they do not render as visible content in the client. These controls simplify client-side or server-side validation when forms are presented to the user for data entry.

  • Custom

    The WebControls are custom ASP.NET controls and, in many ways, function similarly to other rich ASP.NET controls. The WebControls go further than most rich controls in taking advantage of the advanced capabilities of Internet Explorer 5.5 or later versions. Custom controls have their own namespace, which for the WebControls is Microsoft.Web.UI.WebControls.

Tour of the WebControls

This section provides a brief tour of the WebControls and illustrates the type of interface that can be created by each one. Each section focuses on one of the WebControls and links to the appropriate overviews and reference documentation.

TreeView

The TreeView facilitates the authoring of Web pages containing hierarchical datasets, folder views, and other similar structures.

TreeView

The following code sample shows the markup for a simple TreeView UI.


<mytree:treeview runat="server">
  <mytree:treenode Text="Michigan">
     <mytree:treenode Text="Detroit" />
     <mytree:treenode Text="Farmington" />
  </mytree:treenode>
  <mytree:treenode Text="Washington" >
     <mytree:treenode Text="Bellevue" />
     <mytree:treenode Text="Redmond" />
  </mytree:treenode>
</mytree:treeview>

From the sample code it can be seen that the declarative syntax is self-explanatory. In most cases no programming is required to write a fully functional UI element with the WebControls. In addition to Cascading Style Sheets (CSS), the WebControls elements expose several properties that customize the UI.

This control exposes both a server and client Object Model. For more information, see TreeView Reference. The About the TreeView WebControl includes samples and guidelines on using this control.

ToolBar

The Toolbar can be used to author UI elements that render and function in ways similar to the toolbars in Windows applications. In uplevel browsers, the Toolbar can have rich interactive behavior. For example, it can dock with other elements in a Web page or the browser window and can modify its orientation accordingly.

Like the other WebControls, the Toolbar can be customized with graphics elements and CSS.

Toolbar

The Toolbar control exposes both a server and client Object Model. For more information, see Toolbar Reference. The About the Toolbar WebControl includes samples and guidelines on using this control.

TabStrip and MultiPage

The TabStrip is often used in combination with the MultiPage control. However, each control can also be used separately. The following example shows a typical use for these controls.

TabStrip and MultiPage Controls

In the sample, the tabbing UI elements are authored with the TabStrip control. The MultiPage control is used as a container for pages of Web content, which are activated when a Tab is selected. A MultiPage is a container for a collection of PageView elements. Clicking the Tab navigates to a new PageView automatically.

For more detailed information on using these controls, see About the TabStrip WebControl and About the MultiPage WebControl. Also, see the TabStrip Reference and MultiPage Reference pages for links to the client-side and server-side references for these controls.

Benefits

WebControls address the need for a single-source authoring solution that delivers working content in all commonly used browsers while taking advantage of the advanced capabilities offered in uplevel browsers. The uplevel browsers render pages with richer interinteractivitysuperior performance, because they take advantage of DHTML behaviors. The rich client pages reduce the need for server roundtrips, provide superior layout, rendering, and enable extensive customization.

The WebControls simplify the authoring of sophisticated UI elements. Elegant and powerful pages can be authored with the WebControls using a simple declarative syntax. Although declarative authoring is often sufficient to build a fully functional UI, various programming techniques can also be used.

WebControls provide similar benefits to Web developers that Microsoft ActiveX controls do for Windows developers. They encapsulate powerful elements and objects that are easy to use and program.

Features

This section highlights some noteworthy features of the WebControls.

Visual Studio .NET Designers

Several ASP.NET controls can be authored visually in design-mode using the Visual Studio .NET IDE. The WebControls also support this mode of UI authoring, which simplifies the process of generating the declarative markup.

The visual editors in the Visual Studio .NET IDE make it easy to set properties, adding and modifying content on a Web Forms page. And, it is possible to mix source code editing and visual editing. For an introduction to the Microsoft Visual Studio .NET designers, see Using the TreeView Designer in Visual Studio .NET.

Declarative User Interface Authoring

The UI can usually be defined declaratively when authoring pages with the WebControls. This approach is illustrated in many of the samples in the WebControls overviews.

Mouse and Keyboard Support

The WebControls UI elements support both keyboard and mouse interaction, and no additional programming is required to used these features.

Server-side includes

Because the WebControls are authored with ASP.NET, server-side includes are also supported. Server-side includes make it possible to encapsulate content in separate files and can improve the organization of a page. For more information on this topic, see the About the TreeView WebControl.

Data Binding

Some of the WebControls elements support data binding and can act as data consumers for XML and other data sources. This feature enables the content of the UI elements to be generated dynamically. For more information on data binding with the WebControls, see the About the TreeView WebControl.

WebControls Reference Documentation

The WebControls use components on both the client and the server. From ASP.NET, script can be written in a Web Form using the objects exposed by the ASP.NET controls. For those developing their own ASP.NET controls, it is also possible to derive from the WebControls assemblies and extend them. There is also a client mode of programming and authoring with the WebControls. For each ASP.NET control there is a DHTML behavior that exposes its own object model for scripting in Internet Explorer 5.5 or later versions.

Because distinct flavors of content development and programming are possible with the WebControls, depending on whether the client and server objects are used, reference pages are provided for each of the object models exposed to each platform. The reference documentation for the WebControls is organized into the following three sections.

Client Behaviors

When authoring with the WebControls in ASP.NET Web Forms, the client browser is detected. If the client browser is Internet Explorer 5.5 or later, then a DHTML behavior behavior is included in the Web page. This content is downloaded automatically when authoring with WebControls in Web Forms, but it is also possible to use behaviors independently of the server-side authoring environment.

The WebControls deliver premium content and functionality to uplevel browsers and make extensive use of advanced client browser features. Most of the superior performance in the rendering and functionality in the uplevel browsers comes from the use of DHTML behaviors, which have their own Object Model.

In scenarios where the browser type is controlled, such as on a corporate intranet, Web pages can be written to use these behaviors independently of ASP.NET. For more information, see the Internet Explorer WebControls Behaviors Reference.

ASP.NET Objects

The most common mode of authoring with the WebControls is to use ASP.NET Web Forms. Reference pages are provided that include the declarative syntax for each of the WebControls objects and the server-side scripting syntax is also provided. These reference pages provide the most appropriate content for those who are building Web pages with the WebControls that need the most widespread compatibility with different browser types. For more information, see the ASP .NET Server Controls Reference.

WebControls Assemblies

The WebControls assemblies are DLLs that encapsulate the ASP.NET controls. The public portions of these Microsoft .NET components can be inherited, overridden, or extended in user-defined custom control implementations.

The reference pages for the assemblies present the syntax for the WebControls in each of the common language runtime languages. Each class reference page presents the inheritance hierarchy for a given object and, where appropriate, includes links to the references to the ASP.NET objects from which the WebControls classes are derived. These pages include certain implementation details that are not of primary interest to developers using the WebControls to author Web content.

The WebControls implement the following assemblies.

  • Microsoft.Web.UI.WebControls

    This is the main Assembly for the WebControls, which implements the Object Model for the server controls. This Assembly must be imported into a Web Form page before the WebControls UI can be authored in the page, For more information, see Authoring Web Forms with the WebControls.

  • Microsoft.Web.UI.WebControls.Designer

    This Assembly enables visual authoring of the WebControls in the Visual Studio .NET IDE.

For more information, see the WebControls Assembly Reference

Scripting with the Client and Server Components

The WebControls are ASP.NET controls that deliver DHTML behaviors to Internet Explorer 5.5 or later versions. Therefore, both client- and server-side objects can be authored and scripted. When building pages with the WebControls, the recommended approach is to author pages that are either client-based or server-based.

In the general case, where the client browser is neither known or controlled, server-side scripting using ASP.NET Web Forms is recommended. This approach is preferred because the HTML content server-side script in ASP.NET functions in both downlevel browsers and uplevel browsers.

In certain scenarios the browser type is predetermined, such as on corporate intranets. When it is known that a Web page will only be viewed by Internet Explorer 5.5 or later versions, it is both possible, and recommended, to create HTML pages that use client script with the DHTML behaviors. The user experience is improved when roundtrips to the Web server are minimized, and when writing pages purely for the client, all server round trips are eliminated. Updating Web page rendering using DHTML is much faster than posting updates from a Web server.

Warning  Several problems may arise when mixing client- and server-side script in a Web Forms page and, therefore, this mode of programming with the WebControls is not supported. However, advanced developers may find that, in certain scenarios, it is possible to develop pages that function correctly using both types of scripting.

Related Topics

Show: