I want to refresh an <asp:updatepanel> using jQuery. Is this possible?

IceThatJaw · June 13th, 2012, 07:32 PM

I am using FancyBox as recommended by Imar and it's pretty awesome.

The problem I am having is that I need to refresh an update panel when the fancybox iframe closes.

I searched the web and tried 3 different suggestions and none of seem to work.

Right now, I am just refreshing the entire parent page using the beforeClose event but as you can imagine, it's a very ugly process.

Here is my current code:

Code:

 $(document).ready(function () {
        $(".fancyBox").fancybox({
          'type': 'iframe',
          'width': 600,
          'height': 600,
          'minHeight': 600,
          'openEffect': 'none',
          'closeEffect': 'none',
          'beforeClose': function () {
            parent.location.reload(true); // reloads the parent page
          },
          helpers: {
            overlay: {    // overlay options
              speedIn: 300,
              speedOut: 300,
              css: {
                cursor: 'pointer',
                'background-color': 'Gray'
              },
              closeClick: true  // any click on the overlay closes iframe
            }
          }
        });
      });

Imar if you can help that would amazing.

Imar · June 14th, 2012, 03:07 AM

Hi there,

Searching Google for "refresh updatepanel JavaScript" return s a lot of useful stuff:

http://encosia.com/easily-refresh-an...ng-javascript/
http://www.4guysfromrolla.com/articles/033110-1.aspx

The second link even shows how to use FancyBox.

Cheers,

Imar

IceThatJaw · June 14th, 2012, 12:27 PM

Quote:

Originally Posted by Imar

Hi there,

Searching Google for "refresh updatepanel JavaScript" return s a lot of useful stuff:

http://encosia.com/easily-refresh-an...ng-javascript/
http://www.4guysfromrolla.com/articles/033110-1.aspx

The second link even shows how to use FancyBox.

Cheers,

Imar

Thanks. I had already searched the web and tried the hidden button hack and the getpostbackbyreference but they didn't seem to work some reason. They did require me to disable some kind of eventvalidation attribute in my web config so they must have been firing.

I must have been missing something else. The second link is very informative so I will make sure to follow it to the T.

Thanks again.

Imar · June 14th, 2012, 03:40 PM

You're welcome, and good luck with implementing it....

Imar

IceThatJaw · June 14th, 2012, 05:36 PM

Quote:

Originally Posted by Imar

You're welcome, and good luck with implementing it....

Imar

Well, after spending a significant amount of time messing around with their examples the only one that seems to work is the linkbutton hack and even then I had to actually go into the linkbutton's event handler and manually databind the listview to get it to refresh.

At first I thought it was the update panel's ID getting messed up but even after setting clientID mode to static like your book says, it still didn't register.

Oh, well at least it works now. That Javascript always gives me the hardest time.

I have been reading about JSON and I wonder of you use it and what your thoughts on when to use it instead of an update panel.

Thanks again.

Imar · June 14th, 2012, 06:16 PM

Quote:

I have been reading about JSON and I wonder of you use it and what your thoughts on when to use it instead of an update panel.

A great alternative. As explained in the book, the UpdatePanel carries quite a bit of overhead as the whole page still goes through its entire life-cycle.

Using web services (ASMX or WCF) together with a client side framework for interacting with them such as jQuery is a great alternative.

Cheers,

Imar

IceThatJaw · June 14th, 2012, 06:27 PM

Quote:

Originally Posted by Imar

A great alternative. As explained in the book, the UpdatePanel carries quite a bit of overhead as the whole page still goes through its entire life-cycle.

Using web services (ASMX or WCF) together with a client side framework for interacting with them such as jQuery is a great alternative.

Cheers,

Imar

I see. But if you are using mostly grids and listviews is it still worth it? I have yet to see an example on using JSON for a gridview or listview with full crud operations, just very small examples like updating a label.

How difficult would it be in those cases?

Imar · June 15th, 2012, 02:51 AM

Quote:

How difficult would it be in those cases?

To update an existing GridView would be pretty difficult because of all the state it manages.

If you go down the "services" route you need to choose a different type of architecture. You would then use stuff like template binding in jQuery. Here's an example: http://net.tutsplus.com/tutorials/ja...ting-and-ajax/ (not sure if the plugin mentioned there is still around; the link is just meant as an example to give you some idea of what you could so).

To see what you can do if you go all the way with client side binding and service calls, check out this Knockout presentation from Steven Sanderson: http://channel9.msdn.com/Events/Tech...therlands/2159 Cool, but quite complex stuff. Well worth watching, if only to see Steven present.

Cheers,

Imar