CollapsiblePanel: Multiple controls for closing panel

When using the CollapsiblePanel from the AJAX Control Toolkit, you are limited to only one control to collapse/close each panel. This can be restrictive if you wish to use the control which opens the panel (as a 'toggle' control) and have another control (which perhaps sits inside the panel) for closing.

A way round this is to assign a 'BehaviourID' to your Collapsible Panel, and use the following javascript code to action the closing of the panel:

<ajaxToolkit:CollapsiblePanelExtender ID="cpe" runat="Server"
BehaviorId="myBehaviorID"
TargetControlID="InfoPanel"
CollapsedSize="0"
Collapsed="True"
ExpandControlID="OpenCloseControl"
CollapseControlID="OpenCloseControl"
ImageControlID="HideShowImage"
ExpandDirection="Vertical" />

Javascript:

function CloseCpe()
{
$find("myBehaviorID")._doClose();
}


Then on any other control on your page, you add 'CloseCpe'