Solved

ajax animation / update panel / web service call

Posted on 2009-07-08
4
704 Views
Last Modified: 2012-05-07
Hello,

2 part question here.

I would like to have one of those animations where background is greyed out and just little circle turning animation (or whatever it is) that seems fairly common with ajax websites.
The ajax toolkit has a sample but the animations used (fading, collapsong, changing color , etc) are not what i am looking for.  
I was hoping to be able to copy and paste some code and maybe even the animated gif if that is what is used.
I'm not good with the ajax animations stuff and I'm a little short on time to learn it all.

1) Can anyone show me how to accomplish what I am looking for, or provide good link to a clear example where i can leverage working code?  

But  I'm not sure the toolkit sample (UpdatePanelAnimation extender) will work for me.
I have 2 update panels on my page and I wanted the whole page to be disabled when the ajax request is processing, not just the update panel that caused the postback.
Also to further complicate things, the button that send the (potentially) long running request is calling a web service from the client side so its not running all the normal page events like a normal button click on an update panel would do.

Basically i a complex page with grid & details in seperate update panels.
User fills in part of details and needs to click a button that will go execute a stored procedure, return and update a calculated field.
So once they hit this "calculate" button i wanted whole page to disable and prossesing animation shows up data is retrieved from db.

Hope i am explaining this clearly.

2) Can anyone give me a sample of how to do this or a link to a clear example where i can leverage working code?

I'm using Asp.Net 2.0 & Ajax toolkit 1.0
Thanks!

0
Comment
Question by:krazykoder
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
4 Comments
 
LVL 8

Accepted Solution

by:
MrAgile earned 500 total points
ID: 24809275
Hi there,

Forget about ms ajax. You can use a js framework like (www.jquery.com) to achieve what you are seeking. For the modal dialog you can use:

http://dev.iceburg.net/jquery/jqModal/

for the webserivce call you can use this and when you have a working page post another question and we can help with the *update panel* part of the application.

http://www.west-wind.com/weblog/posts/324917.aspx

Sean
0
 

Author Comment

by:krazykoder
ID: 24814637
Hmm, ok I will look into this.

But I have realized that we have an ajax UpdateProgress control implemented in our master page that is giving me the desired effect (modal overlay with animated loading gif) for the update panel partial postback (but it disables the whole page which is what i wanted anyway).  When i added a loop to delay response it kicks in and all seems fine.  This seems good becase it prevents the need to implement something on every content page that needs it.  So i think I am left with only the web service call part.

Would there be a way to manualy start & stop this ajax UpdateProgress control from javascript on my content page before and after my web service call.

We are already using ajax but not JQuery.
I'd rather just stick with 1 method if possible.

But if thats not going to work I'll do whatever needs to be done.

0
 

Author Comment

by:krazykoder
ID: 24815031
http://www.west-wind.com/weblog/posts/324917.aspx

Isn't WCF .NET 3.5?  I'm using 2.0 and not sure how this applies.
My web service call works, I'm not lookign to change it.
0
 

Author Comment

by:krazykoder
ID: 24818853
I figured out how to accomplish what i wanted by leveraging the existing Ajax UpdateProgress control we had on master page.
It already gets triggered on any async postbacks.
And for my web service call I just use a line of code in my sendRequest and OnComplete javascript functions to reference Ajax UpdateProgress control and toggle it's .style.display between block and none.

MrAgile, that jqModal seems real cool.
I will give you the points because I could have implemented it using your jQuery answer and we will be using WCF in our future projects.  So it is good info and links - thank you!

0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Lots of people ask this question on how to extend the “MembershipProvider” to make use of custom authentication like using existing database or make use of some other way of authentication. Many blogs show you how to extend the membership provider c…
I recently went through the process of creating a Calendar Control of events with the basis of using a database to keep track of the dates that are selectable, one requirement was to have the selected date pop-up in a simple lightbox.  At first this…
There are cases when e.g. an IT administrator wants to have full access and view into selected mailboxes on Exchange server, directly from his own email account in Outlook or Outlook Web Access. This proves useful when for example administrator want…
In this video you will find out how to export Office 365 mailboxes using the built in eDiscovery tool. Bear in mind that although this method might be useful in some cases, using PST files as Office 365 backup is troublesome in a long run (more on t…

617 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question