Ajax Collapsible Panel Extender

Collapsible Panel Extender

This control is used to make a panel expanded and collapsed dynamically at runtime properties. Target Control ID : Expand Control ID : Used to specify ID of the control clicking on which the target control has to be expand. Collapse Control ID : Used to specify ID of that control clicking on which the target control has to be collapsed. Expanded size : Used to specify height of the target control when it is expanded. Collapsed size : Used to specify height of the target control when it is collapsed. Expanded Text : Used to specify the text to display when the target control is expanded within the text & label Collapsed Text : Used to specify the text to display when the target control is collapsed within the text lagel. TextLabelID: Used to specify ID of a label in which you want to display expanded text and collapsed text. Example The following example demonstrates how to use the collapsible panel extender. Add a page to the website and then place a Tool kit Script manager & a label & panel on the page and for the label set the ID as L1 and provide some content within the panel. Within HTML source of the page Drag & Drop a collapsible panel Extender and set following properties to it. <asp: collapsible panel Extender ID=” collapsible panel Extender1 runat=”server” targetControlID=”panel1” Expand controlID=”L1” collapse control ID=”L1” ExpandSize=”150” collapsesize=”0” ExpandText=”[Click Here to collapse]” collapsed Text=”[click here to expand]” TextLableID=”L1”>  </asp: collapsible panel Extender> At runtime By clicking on the Label L1 you can collapse and expand the panel