How to Programmatically Collapse Collapsiblepanelextender in C#
Recently I was having a problem to collapse/uncollapse a collapsiblepanelextender programmatically. Normally the code should be: cpe.Cl...
https://www.czetsuyatech.com/2010/11/c-collapse-collapsible-panel-programmatically.html
Recently I was having a problem to collapse/uncollapse a collapsiblepanelextender programmatically.
Normally the code should be:
But this time the button that would trigger the event to un collapse the panel is inside an UpdatePanel, with a Trigger defined.
It's like this:
aspx code:
.cs code:
But it doesn't work, the reason is because updatepanel is updating asynchronously: AsyncPostBackTrigger.
So we need to update the UpdatePanel's Trigger to:
<asp:PostBackTrigger ControlID="btnSubmit" />
That change would usually do the trick.
Normally the code should be:
cpe.ClientState = "false"; cpe.Collapse = false;
But this time the button that would trigger the event to un collapse the panel is inside an UpdatePanel, with a Trigger defined.
It's like this:
aspx code:
<asp:Panel ID="update_container" runat="server">
<asp:UpdatePanel ID="updatePerson" runat="server">
<ContentTemplate>
Hello World
</ContentTemplate>
<Triggers>
<asp:PostBackTrigger ControlID="btnSubmit" />
</Triggers>
</asp:UpdatePanel>
</asp:Panel>
<asp:UpdatePanelAnimationExtender ID="UpdatePanelAnimationExtender1" runat="server"
TargetControlID="updatePerson">
<Animations>
<OnUpdating>
<Sequence>
<Parallel duration="0">
<EnableAction AnimationTarget="btnSubmit" Enabled="false" />
<EnableAction AnimationTarget="effect_color" Enabled="false" />
<EnableAction AnimationTarget="effect_collapse" Enabled="false" />
<EnableAction AnimationTarget="effect_fade" Enabled="false" />
</Parallel>
<Parallel duration=".25" Fps="30">
<Condition ConditionScript="effect_fade">
<FadeOut AnimationTarget="update_container" minimumOpacity=".2" />
</Condition>
</Parallel>
</Sequence>
</OnUpdating>
<OnUpdated>
<Sequence>
<Parallel duration=".25" Fps="30">
<FadeIn AnimationTarget="update_container" minimumOpacity=".2" />
</Parallel>
<Parallel duration="0">
<EnableAction AnimationTarget="effect_fade" Enabled="true" />
<EnableAction AnimationTarget="effect_collapse" Enabled="true" />
<EnableAction AnimationTarget="effect_color" Enabled="true" />
<EnableAction AnimationTarget="btnSubmit" Enabled="true" />
</Parallel>
</Sequence>
</OnUpdated>
</Animations>
</asp:UpdatePanelAnimationExtender>
<asp:Panel ID="pnlTwo" runat="server">
This panel should un collapse.
</asp:Panel>
<asp:CollapsiblePanelExtender ID="cpeMemberInfo" runat="server" TargetControlID="pnlTwo"
ExpandedText="Personal Information" CollapsedText="Personal Information" Collapsed="True"
AutoExpand="True" Enabled="True">
</asp:CollapsiblePanelExtender>
.cs code:
protected void BtnSubmitClick(object sender, EventArgs e)
{
if (IsValid)
{
Thread.Sleep(1000);
cpeMemberInfo.ClientState = "false";
cpeMemberInfo.Collapsed = false;
cpeMemberInfo.AutoExpand = true;
}
}
But it doesn't work, the reason is because updatepanel is updating asynchronously: AsyncPostBackTrigger.
So we need to update the UpdatePanel's Trigger to:
<asp:PostBackTrigger ControlID="btnSubmit" />
That change would usually do the trick.




Post a Comment