CODEWITHSUNDEEP
asp.netajax
Nick Manojlovic
Nick Manojlovic

Reputation: 1171

UpdatePanelAnimationExtender Is not working

I have created an UpdatePanelAnimationExtender and everything compiles but when I run it looks like the UpdatePanelAnimationExtender does not even do anything or even get hit. It hits the button_click and changes the label text but it does not do the div resize. What am I doing wrong? Here is my code:

Thanks for your help in advance. 

    <div style="margin-bottom: 10px;">
    <div style="border: dashed 1px #222222;">
    <div id="up_container" style="background-color: #40669A;">
        <asp:UpdatePanel ID="update" runat="server">
            <ContentTemplate>
                <div id="background" style="text-align: center; vertical-align: middle; line-height: 44px; padding: 12px; height: 44px; color: #FFFFFF;">     
                    <asp:Label ID="lblResult" runat="server" Style="padding: 5px; font-size: 14px; font-weight: bold;">
                        CLICK SAVE BUTTON
                    </asp:Label>
                </div>
            </ContentTemplate>
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="btnCommit" EventName="Click" />
            </Triggers>
        </asp:UpdatePanel>
    </div>
    </div>
    </div>
<asp:UpdatePanelAnimationExtender ID="upae" BehaviorID="animation" runat="server" TargetControlID="update">
    <Animations>
        <OnUpdating>
            <Sequance>
                <ScriptAction Script="var b = $find('animation'); b._originalHeight = b._element.offsetHeight;" />
                <StyleAction Attribute="overflow" Value="hidden" />
                <Parallel duration = ".25" Fps="30">
                    <Resize Height="0" />
                </Parallel>
            </Sequance>                    
        </OnUpdating>
        <OnUpdated>
            <Sequance>
                <Parallel duration=".25" Fps="30">
                    <Resize HeightScript="$find('animation')._originalHeight" />
                </Parallel>
            </Sequance>   
        </OnUpdated>
    </Animations>        
</asp:UpdatePanelAnimationExtender>

<asp:Button ID="btnCommit" runat="server" Text="Save User" TabIndex="5" 
    onclick="btnCommit_Click" />

Upvotes: 0

Views: 2372

Answers (1)

Brian Dishaw
Brian Dishaw

Reputation: 5825

The extender is part of the asp.net ajax toolkit. I think this means you would need to change 

<asp:UpdatePanelAnimationExtender ... </asp:UpdatePanelAnimationExtender>

to

<ajaxToolkit:UpdatePanelAnimationExtender ... </ajaxToolkit:UpdatePanelAnimationExtender>

Hopefully this helps

-Update-

Sequence is misspelled in you example code. Try changing the <Sequance> node to be <Sequence> in both the updating and updated sections.

The above does work, though you can just include <%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %> at the top of page. <asp:AnimationExtender> will be the same as <ajaxToolkit:AnimationExtender>

Upvotes: 1

Related Questions