jquery iframe problem...

Question

I'm having problems with jquery after a page gets loaded via an iframe.

Here's how it works. Mainpage.php has an iframe within it that I use to upload photos/files. On Mainpage.php there is a div that I use to display the photos/files. The div gets populated by an ajax call that retrieves the html and places it inside the div. Everything works fine when I come to Mainpage.php and click on the photos link, which runs the ajax and loads the photos/files.

Problem: I have a "new" button that displays the iframe. Inside the iframe page I use the form upload to upload photos to the server, then if successful I echo a javascript string that runs the same ajax code to display the photo's in the proper div. Everything works and it will update the div on the Mainpage.php, However, the photos get displayed, but the jquery functionality no longer works, so my tablesorter functionality stops working (error: document is null), and the photos don't display with their border (I use css tied to a class, which jquery applies to the elements to display the border). I'm using visuallightbox for my photo gallery and the jquery javascript used to show the images no longer works. The error I get with the photo load is: "uncaught exception.....NS_ERROR_INVALID_POINTER".

Any ideas how to fix/get around this will be appreciated. thanks.

Answer 1

It's hard to tell exactly what it is that you're talking about, but I suspect that the problem may have to do with the fact that the code running in your iframe (the code that runs in the response from the POST) is in a different page, with a different jQuery main object than the code in your parent page.

Try setting things up so that the iframe code calls the parent to pass it the information. Be aware that (especially in IE) you really don't want to instantiate objects in your iframe and then pass them up to the parent window. As soon as the iframe is garbage-collected, IE will start freaking out whenever you reference those objects from the parent window.

Remember that you can get to the parent window's jQuery object from the iframe as window.parent.$.