DotNetNuke Modules – Collapsible Panels

Last week we looked at how to add the ability to collapse a container as part of the DotNetNuke skinning series. Today, we are going to take a look at how to add a similar feature into the modules themselves.

By the way, while it might work for a person interested in skinning to skip the series on creating modules, I think those of you interested in building modules really ought to take a look at the skinning series.

To get a panel to expand and collapse, we need to use the SectionHeadControl. You can register this control in your module by placing the following code at the top of your ASCX page:

<%@ Register Src="~/controls/SectionHeadControl.ascx"
TagName="SectionHead" TagPrefix="DNN" %>

The code to use this control looks something like:

<DNN:SectionHead CssClass="Header"
    runat="server"  ID="m_sectionHeadimageSection"
    IsExpanded="false" Section="m_imageSection"
    Text="Some Label Text Here" />

The Section attribute points to the ID of the section that wraps around the content you want to hide or show. This should not be a control with the runat=”server” attribute assigned to it.

Here is a full list of attributes that you have available:

Attribute Description
IncludeRule True or False. True shows a horizontal rule (HR tag) under the text.
IsExpanded True or False. Controls the initial state of the panel being controlled.
MaximageUrl Overrides the default image for maximize
MinImageUrl Overrides the default image for minimize
Section Points to the control this control is going to expand and collapse.
Text The text to display at the location where this control is regardless of the expanded or collapsed state of the control it is pointing to.
ResourceKey For localization as we’ve discussed before


Other post in DotNetNuke - Module Development

Most Commented Post

Leave a Reply

Comment Policy:

  • You must verify your comment by responding to the automated email that is sent to your email address. Unverified comments will never show.Leave a good comment that adds to the conversation and I'll leave your link in.
  • Leave me pure spam and I'll delete it.
  • Leave a general comment and I'll remove the link but keep the comment.

Notify me of followup comments via e-mail