Share via


WebPartZone Web Server Control Declarative Syntax

Serves as the primary control in the Web Parts control set for hosting WebPart controls on a Web page.

<asp:WebPartZone
    AccessKey="string"
    AllowLayoutChange="True|False"
    BackColor="color name|#dddddd"
    BackImageUrl="uri"
    BorderColor="color name|#dddddd"
    BorderStyle="NotSet|None|Dotted|Dashed|Solid|Double|Groove|Ridge|
        Inset|Outset"
    BorderWidth="size"
    CloseVerb-Checked="True|False"
    CloseVerb-Description="string"
    CloseVerb-Enabled="True|False"
    CloseVerb-ImageUrl="uri"
    CloseVerb-Text="string"
    CloseVerb-Visible="True|False"
    ConnectVerb-Checked="True|False"
    ConnectVerb-Description="string"
    ConnectVerb-Enabled="True|False"
    ConnectVerb-ImageUrl="uri"
    ConnectVerb-Text="string"
    ConnectVerb-Visible="True|False"
    CssClass="string"
    DeleteVerb-Checked="True|False"
    DeleteVerb-Description="string"
    DeleteVerb-Enabled="True|False"
    DeleteVerb-ImageUrl="uri"
    DeleteVerb-Text="string"
    DeleteVerb-Visible="True|False"
    DragHighlightColor="color name|#dddddd"
    EditVerb-Checked="True|False"
    EditVerb-Description="string"
    EditVerb-Enabled="True|False"
    EditVerb-ImageUrl="uri"
    EditVerb-Text="string"
    EditVerb-Visible="True|False"
    EmptyZoneText="string"
    Enabled="True|False"
    EnableTheming="True|False"
    EnableViewState="True|False"
    ExportVerb-Checked="True|False"
    ExportVerb-Description="string"
    ExportVerb-Enabled="True|False"
    ExportVerb-ImageUrl="uri"
    ExportVerb-Text="string"
    ExportVerb-Visible="True|False"
    Font-Bold="True|False"
    Font-Italic="True|False"
    Font-Names="string"
    Font-Overline="True|False"
    Font-Size="string|Smaller|Larger|XX-Small|X-Small|Small|Medium|
        Large|X-Large|XX-Large"
    Font-Strikeout="True|False"
    Font-Underline="True|False"
    ForeColor="color name|#dddddd"
    HeaderText="string"
    Height="size"
    HelpVerb-Checked="True|False"
    HelpVerb-Description="string"
    HelpVerb-Enabled="True|False"
    HelpVerb-ImageUrl="uri"
    HelpVerb-Text="string"
    HelpVerb-Visible="True|False"
    ID="string"
    LayoutOrientation="Horizontal|Vertical"
    MenuCheckImageUrl="uri"
    MenuLabelText="string"
    MenuPopupImageUrl="uri"
    MinimizeVerb-Checked="True|False"
    MinimizeVerb-Description="string"
    MinimizeVerb-Enabled="True|False"
    MinimizeVerb-ImageUrl="uri"
    MinimizeVerb-Text="string"
    MinimizeVerb-Visible="True|False"
    OnCreateVerbs="CreateVerbs event handler"
    OnDataBinding="DataBinding event handler"
    OnDisposed="Disposed event handler"
    OnInit="Init event handler"
    OnLoad="Load event handler"
    OnPreRender="PreRender event handler"
    OnUnload="Unload event handler"
    Padding="integer"
    PartChromeType="Default|TitleAndBorder|None|TitleOnly|BorderOnly"
    RestoreVerb-Checked="True|False"
    RestoreVerb-Description="string"
    RestoreVerb-Enabled="True|False"
    RestoreVerb-ImageUrl="uri"
    RestoreVerb-Text="string"
    RestoreVerb-Visible="True|False"
    runat="server"
    ShowTitleIcons="True|False"
    SkinID="string"
    Style="string"
    TabIndex="integer"
    TitleBarVerbButtonType="Button|Image|Link"
    ToolTip="string"
    VerbButtonType="Button|Image|Link"
    Visible="True|False"
    WebPartVerbRenderMode="Menu|TitleBar"
    Width="size"
>
        <EmptyZoneTextStyle />
        <ErrorStyle />
        <FooterStyle
            BackColor="color name|#dddddd"
            BorderColor="color name|#dddddd"
            BorderStyle="NotSet|None|Dotted|Dashed|Solid|Double|
                Groove|Ridge|Inset|Outset"
            BorderWidth="size"
            CssClass="string"
            Font-Bold="True|False"
            Font-Italic="True|False"
            Font-Names="string"
            Font-Overline="True|False"
            Font-Size="string|Smaller|Larger|XX-Small|X-Small|
                Small|Medium|Large|X-Large|XX-Large"
            Font-Strikeout="True|False"
            Font-Underline="True|False"
            ForeColor="color name|#dddddd"
            Height="size"
            HorizontalAlign="NotSet|Left|Center|Right|Justify"
            OnDisposed="Disposed event handler"
            VerticalAlign="NotSet|Top|Middle|Bottom"
            Width="size"
            Wrap="True|False"
        />
        <HeaderStyle
            BackColor="color name|#dddddd"
            BorderColor="color name|#dddddd"
            BorderStyle="NotSet|None|Dotted|Dashed|Solid|Double|
                Groove|Ridge|Inset|Outset"
            BorderWidth="size"
            CssClass="string"
            Font-Bold="True|False"
            Font-Italic="True|False"
            Font-Names="string"
            Font-Overline="True|False"
            Font-Size="string|Smaller|Larger|XX-Small|X-Small|
                Small|Medium|Large|X-Large|XX-Large"
            Font-Strikeout="True|False"
            Font-Underline="True|False"
            ForeColor="color name|#dddddd"
            Height="size"
            HorizontalAlign="NotSet|Left|Center|Right|Justify"
            OnDisposed="Disposed event handler"
            VerticalAlign="NotSet|Top|Middle|Bottom"
            Width="size"
            Wrap="True|False"
        />
        <PartChromeStyle />
        <PartStyle
            BackColor="color name|#dddddd"
            BackImageUrl="uri"
            BorderColor="color name|#dddddd"
            BorderStyle="NotSet|None|Dotted|Dashed|Solid|Double|
                Groove|Ridge|Inset|Outset"
            BorderWidth="size"
            CellPadding="integer"
            CellSpacing="integer"
            CssClass="string"
            Font-Bold="True|False"
            Font-Italic="True|False"
            Font-Names="string"
            Font-Overline="True|False"
            Font-Size="string|Smaller|Larger|XX-Small|X-Small|
                Small|Medium|Large|X-Large|XX-Large"
            Font-Strikeout="True|False"
            Font-Underline="True|False"
            ForeColor="color name|#dddddd"
            GridLines="None|Horizontal|Vertical|Both"
            Height="size"
            HorizontalAlign="NotSet|Left|Center|Right|Justify"
            OnDisposed="Disposed event handler"
            Width="size"
        />
        <PartTitleStyle
            BackColor="color name|#dddddd"
            BorderColor="color name|#dddddd"
            BorderStyle="NotSet|None|Dotted|Dashed|Solid|Double|
Groove|Ridge|Inset|Outset"
            BorderWidth="size"
            CssClass="string"
            Font-Bold="True|False"
            Font-Italic="True|False"
            Font-Names="string"
            Font-Overline="True|False"
            Font-Size="string|Smaller|Larger|XX-Small|X-Small|
                Small|Medium|Large|X-Large|XX-Large"
            Font-Strikeout="True|False"
            Font-Underline="True|False"
            ForeColor="color name|#dddddd"
            Height="size"
            HorizontalAlign="NotSet|Left|Center|Right|Justify"
            OnDisposed="Disposed event handler"
            VerticalAlign="NotSet|Top|Middle|Bottom"
            Width="size"
            Wrap="True|False"
        />
        <VerbStyle />
        <CloseVerb
            Checked="True|False"
            Description="string"
            Enabled="True|False"
            ImageUrl="uri"
            Text="string"
            Visible="True|False"
        />
        <ConnectVerb
            Checked="True|False"
            Description="string"
            Enabled="True|False"
            ImageUrl="uri"
            Text="string"
            Visible="True|False"
        />
        <DeleteVerb
            Checked="True|False"
            Description="string"
            Enabled="True|False"
            ImageUrl="uri"
            Text="string"
            Visible="True|False"
        />
        <EditVerb
            Checked="True|False"
            Description="string"
            Enabled="True|False"
            ImageUrl="uri"
            Text="string"
            Visible="True|False"
            />
        <ExportVerb
            Checked="True|False"
            Description="string"
            Enabled="True|False"
            ImageUrl="uri"
            Text="string"
            Visible="True|False"
        />
        <HelpVerb
            Checked="True|False"
            Description="string"
            Enabled="True|False"
            ImageUrl="uri"
            Text="string"
            Visible="True|False"
        />
        <MenuCheckImageStyle />
        <MenuLabelHoverStyle />
        <MenuLabelStyle />
        <MenuPopupStyle
            BackColor="color name|#dddddd"
            BackImageUrl="uri"
            BorderColor="color name|#dddddd"
            BorderStyle="NotSet|None|Dotted|Dashed|Solid|Double|
                Groove|Ridge|Inset|Outset"
            BorderWidth="size"
            CellPadding="integer"
            CellSpacing="integer"
            CssClass="string"
            Font-Bold="True|False"
            Font-Italic="True|False"
            Font-Names="string"
            Font-Overline="True|False"
            Font-Size="string|Smaller|Larger|XX-Small|X-Small|
                Small|Medium|Large|X-Large|XX-Large"
            Font-Strikeout="True|False"
            Font-Underline="True|False"
            ForeColor="color name|#dddddd"
            GridLines="None|Horizontal|Vertical|Both"
            Height="size"
            OnDisposed="Disposed event handler"
            ShadowColor="color name|#dddddd"
            Width="size"
        />
        <MenuVerbHoverStyle />
        <MenuVerbStyle />
        <MinimizeVerb
            Checked="True|False"
            Description="string"
            Enabled="True|False"
            ImageUrl="uri"
            Text="string"
            Visible="True|False"
        />
        <RestoreVerb
            Checked="True|False"
            Description="string"
            Enabled="True|False"
            ImageUrl="uri"
            Text="string"
            Visible="True|False"
        />
        <SelectedPartChromeStyle />
        <TitleBarVerbStyle />
        <ZoneTemplate>
            <!-- child controls -->
        </ZoneTemplate>
</asp:WebPartZone>

Remarks

The WebPartZone control contains WebPart controls, which form the main user interface (UI) of Web Parts applications. A WebPartZone control can be declared in persistence format on a Web page, enabling developers to use it as a template and to add other server controls within the asp:webpartzone element. Any type of server control, if added to a WebPartZone zone, can function as a WebPart control at run time. This is true regardless of whether the added control is a WebPart, user, custom, or an ASP.NET control. For more information, see GenericWebPart.

For more information on the WebPartZone and Web Parts controls, see ASP.NET Web Parts Controls.

Example

The following code example demonstrates how to use the WebPartZone control declaratively in a Web Parts scenario using the Calendar control. The Web page allows a user to enter edit mode to edit certain aspects of the Calendar control. The Toggle Scope button switches the page to user or shared personalization scope. The Edit Mode and Browse Mode buttons each switch the page into the appropriate display mode. Notice in the <script> tag section of the file that two of the methods that handle events use the Personalization property to access useful members of the underlying object. Specifically, these methods use the ToggleScope method and the Scope property on the object that is accessed through the Personalization property.

For the code example to run, you also must enable one or more users to personalize pages in shared scope. To do this, add an entry to the Web.config file, in the webParts Element (ASP.NET Settings Schema).

<%@ Page Language="VB" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">
    Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs)
        If ((mgr1.Personalization.Scope = PersonalizationScope.User) _
           And (mgr1.Personalization.CanEnterSharedScope)) Then
            mgr1.Personalization.ToggleScope()

        ElseIf (mgr1.Personalization.Scope = PersonalizationScope.Shared) Then
            mgr1.Personalization.ToggleScope()
        Else
            'If the user cannot enter shared scope you may want
            ' to notify them on the page.
        End If
    End Sub


    Protected Sub Button2_Click(ByVal sender As Object, ByVal e As System.EventArgs)
        mgr1.DisplayMode = WebPartManager.EditDisplayMode
    End Sub    

    Protected Sub Button3_Click(ByVal sender As Object, ByVal e As System.EventArgs)
        mgr1.DisplayMode = WebPartManager.BrowseDisplayMode
    End Sub


    Protected Sub Page_Load(ByVal sender As Object, ByVal e As CommandEventArgs)
        Label1.Text = "Scope is: " _
        + mgr1.Personalization.Scope.ToString()
    End Sub

</script>


<html xmlns="http://www.w3.org/1999/xhtml" >

<head id="head1" runat="server">
    <title>Web Parts Declarative Example</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
      <asp:LoginName id="LoginName1" runat="server" />
      <asp:WebPartManager id="mgr1" runat="server">
        <Personalization InitialScope="Shared" Enabled="True" />
      </asp:WebPartManager>
      <asp:WebPartZone id="WebPartZone1" runat="server">
        <ZoneTemplate>
          <asp:Calendar id="Calendar1" runat="server" />
        </ZoneTemplate>
        <CloseVerb Text="Close This Part" />
        <MinimizeVerb Text="Minimize This Part" />
        <EditVerb Text="Edit This Part" />
      </asp:WebPartZone>
      <asp:EditorZone id="EditorZone1" runat="server">
        <ZoneTemplate>
          <asp:LayoutEditorPart HorizontalAlign="Center" id="Layout1" runat="server" Title="My Custom Layout" />
          <asp:AppearanceEditorPart id="AppearanceEditorPart1" 
            runat="server" BackColor="LightGray" />
          <asp:BehaviorEditorPart id="BehaviorEditorPart1" 
            runat="server"  />
        </ZoneTemplate>
      </asp:EditorZone>
      <hr />
      <asp:Button id="Button1" runat="server" Text="Toggle Scope" OnClick="Button1_Click"  />
      <asp:Button id="Button2" runat="server" Text="Edit Mode" OnClick="Button2_Click" />
      <asp:Button id="Button3" runat="server" Text="Browse Mode" OnClick="Button3_Click" />
      <br />
      <asp:Label id="Label1" runat="server" Text="" />
    </div>
    </form>
</body>
</html>

<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">
  protected void Button1_Click(object sender, EventArgs e)
  {
    if ((mgr1.Personalization.Scope == PersonalizationScope.User)
        && (mgr1.Personalization.CanEnterSharedScope))
    {
      mgr1.Personalization.ToggleScope();
    }
    else if (mgr1.Personalization.Scope ==
          PersonalizationScope.Shared)
    {
      mgr1.Personalization.ToggleScope();
    }
    else
    {
      // If the user cannot enter shared scope you may want
      // to notify them on the page.
    }
  }



  protected void Button2_Click(object sender, EventArgs e)
  {
    mgr1.DisplayMode = WebPartManager.EditDisplayMode;
  }


  protected void Button3_Click(object sender, EventArgs e)
  {
    mgr1.DisplayMode = WebPartManager.BrowseDisplayMode;
  }


  protected void Page_Load(object sender, EventArgs e)
  {
    Label1.Text = "Scope is: "
      + mgr1.Personalization.Scope.ToString();
  }

</script>

<html xmlns="http://www.w3.org/1999/xhtml" >

<head id="head1" runat="server">
    <title>Web Parts Declarative Example</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
      <asp:LoginName id="LoginName1" runat="server" />
      <asp:WebPartManager id="mgr1" runat="server">
        <Personalization InitialScope="Shared" Enabled="True" />
      </asp:WebPartManager>
      <asp:WebPartZone id="WebPartZone1" runat="server">
        <ZoneTemplate>
          <asp:Calendar id="Calendar1" runat="server" />
        </ZoneTemplate>
        <CloseVerb Text="Close This Part" />
        <MinimizeVerb Text="Minimize This Part" />
        <EditVerb Text="Edit This Part" />
      </asp:WebPartZone>
      <asp:EditorZone id="EditorZone1" runat="server">
        <ZoneTemplate>
          <asp:LayoutEditorPart HorizontalAlign="Center" id="Layout1" runat="server" Title="My Custom Layout" />
          <asp:AppearanceEditorPart id="AppearanceEditorPart1" 
            runat="server" BackColor="LightGray" />
          <asp:BehaviorEditorPart id="BehaviorEditorPart1" 
            runat="server"  />
        </ZoneTemplate>
      </asp:EditorZone>
      <hr />
      <asp:Button id="Button1" runat="server" Text="Toggle Scope" OnClick="Button1_Click"  />
      <asp:Button id="Button2" runat="server" Text="Edit Mode" OnClick="Button2_Click" />
      <asp:Button id="Button3" runat="server" Text="Browse Mode" OnClick="Button3_Click" />
      <br />
      <asp:Label id="Label1" runat="server" Text="" />
    </div>
    </form>
</body>
</html>

See Also

Reference

WebPartZone

Other Resources

ASP.NET Web Parts Controls