Expandability

By default, you can expand the content area of the Expander control by simply clicking on the header as IsExpandable property of the Expander control is set to True. However, there might be a scenario where you may want to prevent expansion of the Expander control until a specific event occurs. In that case, you would need to set IsExpandable property to False as you want the Expander control to remain collapsed until the occurrence of the specified event.

The following code showcases the use of the IsExpandable property. In this example, the IsExpandable property is set to false to keep the Expander control in collapsed state.

<C1Expander Header="@("Click")" IsExpandable="false" HeaderStyle="@("background-color: BurlyWood")" Style="@("overflow:hidden;width:25%;box-shadow:0px 5px 5px rgba(0,0,0,0.2)")">
    <C1Calendar FirstDayOfWeek="@DayOfWeek.Monday"></C1Calendar>
</C1Expander>

Note: By default, child content is removed from the Document Object Model (DOM) to improve performance when C1Expander is collapsed. User can change this behavior by setting the RetainChildContent property to true. This preserves the expander’s child elements in the DOM when collapsed, allowing the state of nested components (for example, checkboxes or text inputs) to remain unchanged between expand and collapse actions.