ansaurus

Question

Jquery Fancybox not working after postback

Answer 1

+1 A:

Could it be that the instantiating code is being inserted at a piece of code which is not run after a postback?

Ropstah 2009-09-25 13:32:06

Interesting.. the fancybox instanciating code is on the aspx page.. I might try writing it to the page from the code behind..

Lee Englestone 2009-09-25 13:37:02

Tried it. No joy :-(

Lee Englestone 2009-09-25 13:43:48

Answer 2

A:

It was the Update panel as described

here.. http://stackoverflow.com/questions/301473/rebinding-events-in-jquery-after-ajax-update-updatepanel

As suggested I simply replaced

$(document).ready(function() {
            $("a.watchvideo").fancybox({
            'overlayShow': false,
            'frameWidth' : 480,
            'frameHeight' : 400
            });
        });

with

function pageLoad(sender, args)
{
   if(args.get_isPartialLoad())
   {
       $("a.watchvideo").fancybox({
            'overlayShow': false,
            'frameWidth' : 480,
            'frameHeight' : 400
            });

   }
}

and it worked!

-- Lee

Lee Englestone 2009-09-25 14:00:06

Answer 3

+5 A:

The problem is in using $(document).ready() to bind the fancybox. This code is only executed once, when the page is originally loaded. If you want the fancybox functionality on every postback, synchronous or asynchronous, replace the $(document).ready() with pageLoad(sender, args). i.e.

function pageLoad(sender, args) {
        $("a.watchvideo").fancybox({
        'overlayShow': false,
        'frameWidth' : 480,
        'frameHeight' : 400
        });
}

see this answer for more info

Russ Cam 2009-09-25 14:00:38

Cheers Russ, looks like you would have solved my problem had I not got there on my own. Much appreciated. Cheers,-- Lee

Lee Englestone 2009-09-25 14:17:02

No probs, glad to help. I highly recommend looking into the links on the other answer - the article is a good read and the ASP.NET AJAX documentation can prove extremely useful.

Russ Cam 2009-09-25 14:18:46

Thanks I just had this issue to and I'm not well versed on jQuery yet. This solved it! Thanks so much for posting this.

Frank Hale 2010-07-15 15:06:07

Answer 4

A:

This might help someone else, but FancyBox appends it's code to the <body> element... which is all fine and well, but resides OUTSIDE the asp.net <form> element. My postback problems went away when I modified FancyBox to append its dom objects to the <form> element:

$('body form:first').append( ... );

2010-04-27 05:18:40

ansaurus

tags:

views:

answers:

Jquery Fancybox not working after postback

related questions