Question

I’m using a CollapsiblePanelExtender with a checkbox. I would want to make the panel expand/collapse as the checkbox is checked and unchecked. This works but the problem I’m encountering is that when page loads the panel is not expanding or collapsing accordingly to the state which is loaded from the DB. In other words setting the Collapsed property of the CollapsiblePanelExtender int the page_load to true or false does not seem to affect it.

This is what I have:

<asp:CheckBox runat="server" ID="ServiceCheckBox" AutoPostBack="true" Enabled="true"
OnCheckedChanged="CheckBoxCheckedStatusChanged" />

<asp:CollapsiblePanelExtender
ID="ServiceCollapsiblePanelExtender"
runat="server"
TargetControlID ="ServicePanel"
CollapsedSize ="0"
Collapsed ="true"
CollapseControlID ="ServiceCheckBox"
ExpandControlID ="ServiceCheckBox" >

   //codebehind
    protected new void Page_Load(object sender, EventArgs e)
    {
      if (!IsPostBack)
      {
        ServiceCheckBox.Checked = GetState();

        ServiceCollapsiblePanelExtender.Collapsed = !ServiceCheckBox.Checked;
      }
   }

I’d rather want to get this working with serverside events instead of clientside scripting (js).
Anyone any idea on how to get this working?

Answer 1

According to this link you need to also change the ClientState of the CollapsiblePanelExtender:

if(ServiceCheckBox.Checked)
{
    ServiceCollapsiblePanelExtender.Collapsed = false;
    ServiceCollapsiblePanelExtender.ClientState = "false";
}
else
{
    ServiceCollapsiblePanelExtender.Collapsed = true;
    ServiceCollapsiblePanelExtender.ClientState = "true";
}