<%@ Page Language="C#" MasterPageFile="~/aspnet/section.master" %> <%@ Register TagPrefix=Acme Namespace=Acme %> <%@ Register TagPrefix="Acme" TagName="SourceRef" Src="~/util/SrcRef.ascx"%>

Editing Web Part Properties

key feature of Web Parts is the ability of end users to modify (or personalize) Web pages according to their preferences, and save their personalized settings for future browser sessions. One aspect of modifying Web Parts pages includes editing; users can edit the appearance, layout, behavior, and other properties of the visible WebPart controls.

This example show how to edit web part properties
  1. Log in to the page.
  2. Select "Edit" from the dropdown.
  3. Click the dropdown arrow on the Calendar's Verb Menu, and select "Edit" from the menu. The editor will now be visible, with a property grid showing the Text property.
  4. Change the title property and click on. the new title should be set in the calendar control

Developer can take advantage of the Multiview control to have a full page editing.

This example show how to implement a full page editing scenario using multiview
  1. Log in to the page.
  2. Select "Edit" from the dropdown.
  3. Click the dropdown arrow on the Calendar's Verb Menu, and select "Edit" from the menu. The editor will now be visible, with a property grid showing the Text property.
  4. Change the title property and click on. the new title should be set in the calendar control

A web part can also specify properties that can be edited by the user. To provide editable properties, you can mark the property declaration with the WebBrowsable attribute. The page's EditorZone must also include an editor part capable of editing custom properties. You can use the PropertyGridEditorPart to provide editing for custom properties in a property grid.

This example makes the Text property of the web part editable, and uses a PropertyGridEditorPart to allow users to edit it.
  1. Log in to the page.
  2. Select "Edit" from the dropdown.
  3. Click the dropdown arrow on the Text Display Web Part's Verb Menu, and select "Edit" from the menu. The editor will now be visible, with a property grid showing the Text property.

Developers can specify a friendly name for properties marked as WebBrowsable by declaring the WebDisplayName attribute.

This example marks the Text property as WebDisplayName to show a friendly name in the PropertyGridEditorPart.
  1. Log in to the page.
  2. Select "Edit" from the dropdown.
  3. Click the dropdown arrow on the Text Display Web Part's Verb Menu, and select "Edit" from the menu. The editor will now be visible, with a property grid showing the Friendly name.

Developers can also specify a tooltip for properties marked as WebBrowsable by declaring the WebDescription attribute.

This example marks the Text property as WebDescription to show a tooltip in the PropertyGridEditorPart.
  1. Log in to the page.
  2. Select "Edit" from the dropdown.
  3. Click the dropdown arrow on the Text Display Web Part's Verb Menu, and select "Edit" from the menu. The editor will now be visible, with a property grid showing the Friendly name.

You can also provide your own custom editor parts for editing part properties. These parts are displayed in the editor zone when the user edits the web part.

To create a custom editor part, inherit from the EditorWebPart control. The EditorWebPart control is a composite control, so you can override the CreateChildControls method, and create controls for the part. You also need to override the ApplyChanges and SyncChanges methods to apply changes made in the editor part to the control.

To provide custom editor parts, you can implement the IWebEditable interface on the part, and implement the CreateEditorParts method and the WebBrowsableObject property. The CreateEditorParts method should return a collection of editor parts.

This example shows a custom editor part.
  1. Log in to the page.
  2. Select "Edit" from the dropdown.
  3. Click the dropdown arrow on the Text Display Web Part's Verb Menu, and select "Edit" from the menu. The editor will now be visible, with the custom editor part