Loading...

Creating Webparts

Software
Feb 7, 2008
#csharp
#asp.net
Avatar
Author
Matt Kruskamp

Overview

This is the first of a couple articles on managing web parts. I would like to keep these articles as simple and concise as possible. This tutorial simply covers how to place WebParts onto the screen. WebParts are a portion of Asp.Net that doesn’t receive very much love. From my experience they feel complex, and where to apply them in your application very ambiguous. Let’s just start with creating one.

Creating your WebPart

  • Open Visual Studio (I am using 2008), and add a new website This will create the Default.aspx page. Open the Default.aspx page
  • Create three Divs
  • Drag a WebPartManager and a DropDownList in the first
  • Drag a WebPartZone in the second
  • Drag a WebPartZone in the third
<div>
  <asp:WebPartManager ID=“WebPartManager1” runat=“server”>
  </asp:WebPartManager>
  <asp:DropDownList ID=“DropDownList1” runat=“server”>
  </asp:DropDownList>
</div>
<div>
  <asp:WebPartZone ID=“WebPartZone1” runat=“server”>
  </asp:WebPartZone>
</div>
<div>
  <asp:WebPartZone ID=“WebPartZone2” runat=“server”>
  </asp:WebPartZone>
</div>

In the design view, place something in each webpartzone (like a calendar, button, or wizard control)

<div>
  <asp:WebPartZone ID=“WebPartZone1” runat=“server”>
    <ZoneTemplate>
      <asp:Calendar ID=“Calendar1” runat=“server” />
    </ZoneTemplate>
  </asp:WebPartZone>
</div>
<div>
  <asp:WebPartZone ID=“WebPartZone2” runat=“server”>
    <ZoneTemplate>
      <asp:Button ID=“Button1” runat=“server” Text=“Button” />
    </ZoneTemplate>
  </asp:WebPartZone>
</div>

Set your dropdown list to AutoPostBack and then double click it to create an event handler. Then switch to your code-behind and change your code to this:

protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        // Set up the list of options
        foreach (WebPartDisplayMode mode in this.WebPartManager1.SupportedDisplayModes)

        // Add an item for each mode
        this.DropDownList1.Items.Add(
                new ListItem(mode.Name, mode.Name));
    }

    this.WebPartManager1.DisplayMode =
          this.WebPartManager1.SupportedDisplayModes[
          this.DropDownList1.SelectedValue];
}

protected void DropDownList1_SelectedIndexChanged1(
                     object sender, EventArgs e)
{
    this.WebPartManager1.DisplayMode =
          this.WebPartManager1.SupportedDisplayModes[
                  this.DropDownList1.SelectedValue];
}

Explaination

The first time the page loads, the dropdown will populate with the different display modes of the WebPartManager. The WebPartManager handles all of the cool drag and drop functionality. With every page load, the WebPartManager is set to the display mode specified by the dropdown. The eventhandler just changes the display mode of the WebPartManager.

If you run this code in IE, you will see your dropdown with options. If you select the Design options, you can move the controls inside the WebPartZone to another WebPartZone. In Firefox, this functionality isn’t there, but we will enable it in the next article.

Conclusion

This is the simple hello world application with WebParts. In the near future, we will cover more advanced topics in WebParts as well as how and where to integrate them into your application.

Happy Coding

2 min read
Share this post:

Comments

comments powered by Disqus

Related Articles

All articles
Aug 1, 2007

Lousiana Pacific

Louisana Pacific is a premiere building products company. Managing the company requires many internal business applications for its various operations.

Software Feb 6, 2008

CollapsiblePanelExtender Flicker

I noticed that when I used the CollapsiblePanelExtender, it had a tendancy to flicker once when the page loads. Here is my quick fix for that.

Software Mar 2, 2007

C# Tutorial: Linked List

For archive purposes, I am posing a custom, generic, sortable, event-driven, doubly-linked list. In the future I will run some tests on it to see if it beats the current linked list implementation provided by the .

The pixel mine

I'm currently the Co-Founder / CTO with an amazing team at Rentler. We build property management software for independant landlords and their renters using a plethora of technologies.

View work
Illustration Illustration
Top