Showing posts with label animation. Show all posts
Showing posts with label animation. Show all posts

Wednesday, March 28, 2012

Multiple Update Panel Animation Extenders on one page

Hi there!

I'm developing a web user control that contains an Update Panel and uses an Update Panel Animation Extender.
The animation is quite simple: while the panel is updating, it fades out the contents of the update panel and fades in the "please wait while processing..." message...then the animation reverses the process when the panel is Updated. The animation works quite nicely.

The problem I'm facing is when I have more than one of these web user controls on the page at a time (I'm using 8 of these on one page at a time).
If one web user control's update panel does an asynchronous postback, all of the animations are run!

Does anyone know how to get around this problem?

Thanks in advance,

-Frinny

Hi,

Would you please provide with any code of ypur usercontrol?

Or create a simple repro of this problem?

Thanks,


I forgot that I had posted this question.
I found the solution to my problem a while ago.

The problem I was describing is not actually a problem, it is how the UpdatePanelAnimationExtender works.

Anyways, to get around this problem I ended up using regular Animations instead of the UpdatePanelAnimationExtender.

Cheers!

Multiple UpdatePanels with Animations

I have three UpdatePanels on a web page. Each of them has an Animation that makes them fade out and back in when updating. I have set the UpdateMode to conditional but when I update one of the panels the other two fade out and don't come back. Does any one have an idea of what's going on here?

Thanks in Advance!!!!!!

I have the same problem ...


This works for me

<body> <form id="form1" runat="server"> <asp:ScriptManager runat="server" ID="ScriptManager" /> <div> <asp:UpdatePanel runat="server" ID="up1" UpdateMode="conditional"> <ContentTemplate> 1:<%=DateTime.Now.ToLongTimeString%> </ContentTemplate> <Triggers><asp:AsyncPostBackTrigger ControlID="Button1" EventName="click" /></Triggers> </asp:UpdatePanel> <asp:UpdatePanel runat="server" ID="up2" UpdateMode="conditional"> <ContentTemplate> 1:<%=DateTime.Now.ToLongTimeString%> </ContentTemplate> <Triggers><asp:AsyncPostBackTrigger ControlID="Button2" EventName="click" /></Triggers> </asp:UpdatePanel> <asp:UpdatePanel runat="server" ID="up3" UpdateMode="conditional"> <ContentTemplate> 1:<%=DateTime.Now.ToLongTimeString%> </ContentTemplate> <Triggers><asp:AsyncPostBackTrigger ControlID="Button3" EventName="click" /></Triggers> </asp:UpdatePanel> <asp:Button runat="server" ID="Button1" Text="Button1" /> <asp:Button runat="server" ID="Button2" Text="Button2" /> <asp:Button runat="server" ID="Button3" Text="Button3" /> <ajaxToolkit:UpdatePanelAnimationExtender ID="ae" runat="server" TargetControlID="up1"> <Animations> <OnUpdated> <Color Duration="1" StartValue="#FF0000" EndValue="#ffffff" Property="style" PropertyKey="backgroundColor" /> </OnUpdated> </Animations></ajaxToolkit:UpdatePanelAnimationExtender><ajaxToolkit:UpdatePanelAnimationExtender ID="UpdatePanelAnimationExtender1" runat="server" TargetControlID="up2"> <Animations> <OnUpdated> <Color Duration="1" StartValue="#00FF00" EndValue="#ffffff" Property="style" PropertyKey="backgroundColor" /> </OnUpdated> </Animations></ajaxToolkit:UpdatePanelAnimationExtender><ajaxToolkit:UpdatePanelAnimationExtender ID="UpdatePanelAnimationExtender2" runat="server" TargetControlID="up3"> <Animations> <OnUpdated> <Color Duration="1" StartValue="#0000FF" EndValue="#ffffff" Property="style" PropertyKey="backgroundColor" /> </OnUpdated> </Animations></ajaxToolkit:UpdatePanelAnimationExtender> </div> </form></body>

Thanks!!! It works great.

Monday, March 26, 2012

Multiview, updatepanel, animation extender....bad combo?

I got a multiview inside of an updatepanel. The multiview has a view which has an updatepanel. There's an animation extender on the inner updatepanel. The extender has an animation of fadeout on onloading and fadein on onloaded.

When I run it, when the inner updatepanel is to update, I see it fadeout ever so slightly in IE and not at all in firefox. The updated data doesn't fade in, it just shows up. I set the duration of the fadeout/in to high values to test. didn't help. The change just shows without animation.

Is there a way to do this?

Did some more fiddling. It seems putting an updatepanel inside an update panel removes the animation.

Just had to remove the children as triggers and always update and it works.