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

Related Post

  • DotNetNuke Modules – Creating Base ModulesDotNetNuke Modules – Creating Base Modules Now that we have DotNetNuke installed into Visual Studio we can go ahead and create our first modules. Actually, creating the modules is pretty simple. But it is even easier to do it wrong, which...
  • DotNetNuke Skinning – Collapsible ContainersDotNetNuke Skinning – Collapsible Containers One feature you'll see in DotNetNuke containers is the ability to collapse the container using an icon, typically in the upper right hand corner of the container. Implementing collapsible container...
  • DotNetNuke Skins – Skin ObjectsDotNetNuke Skins – Skin Objects There are a number of DotNetNuke controls, which they call objects, that are available to the skin designer. This adds functionality to the page such as a link to login/logout, date/time, username,...
  • DotNetNuke Modules – Where Stuff Shows UpDotNetNuke Modules – Where Stuff Shows Up We continue our series on creating DotNetNuke modules today by showing you where the various components of the module we created last week show up in DotNetNuke. Remember, last Thursday, we ...
  • DotNetNuke – SkinningDotNetNuke – Skinning Today I'm going to start a separate series on Skinning DotNetNuke. Don't worry, I'm still planning to continue the series on creating modules. Later on, I may start a series on something else. But ...