Fancybox not working with Ajax loaded content

1,606 views
Skip to first unread message

Matt

unread,
Mar 22, 2010, 4:49:13 PM3/22/10
to fancybox
I found one thread discussing this issue, but there was no
resolution. I am hoping I can explain the situation a little more
clearly and get a resolution.

We have a web app that has a search engine. The search engine allows
an end user to search for books in our system. Below the search
engine we have a DIV with an ID of "searchResults". When a user
searches for results, we use an ajax call and get our results
delivered back to that div. The results are formatted as HTML and
include A links with the correct class names for fancybox to trigger.

Fancybox is set up in the main HTML page that the search form is on.
We have other fancybox link on that main HTML page and they work
perfectly. Our issue is that all of the link that get returned in the
"searchResults" DIV fail to open in a fancy box.

NOW, if i include the javascript code for the fancybox along with the
fancybox.js and the jquery.js with the HTML in to the searchResults
div the fancybox links work perfectly. Problem here is that the
search results are delivered as a person types and javascript crashes
pretty quickly.

So, question is... Is there ANY way that we can keep the javascript on
the main HTML page, but have it load the fancybox links when they
appear in the new HTML in the searchResults DIV as they are loaded via
Ajax?

thanks!

JFK

unread,
Mar 22, 2010, 5:15:01 PM3/22/10
to fancybox
any link?

EpleVC

unread,
Mar 24, 2010, 5:44:03 AM3/24/10
to fancybox
Hi good to read that there is someone with a kind of similar problem.
I posted before at this post
http://groups.google.com/group/fancybox/browse_thread/thread/e2af3d1e966153d9/048a24963009aecd?lnk=gst
. The search results are also created with AJAX and then loaded inside
HTML. Still no solution here?


On 22 mrt, 22:15, JFK <jfk.d...@gmail.com> wrote:
> any link?
>
> On Mar 22, 1:49 pm, Matt <mass...@gmail.com> wrote:
>
> > I found one thread discussing this issue, but there was no
> > resolution.  I am hoping I can explain the situation a little more
> > clearly and get a resolution.
>
> > We have a web app that has asearchengine.  Thesearchengine allows

> > an end user tosearchfor books in our system.  Below thesearch


> > engine we have a DIV with an ID of "searchResults".  When a user

> > searches for results, we use anajaxcall and get our results


> > delivered back to that div.  The results are formatted as HTML and
> > include A links with the correct class names for fancybox to trigger.
>

> > Fancybox is set up in the main HTML page that thesearchform is on.


> > We have other fancybox link on that main HTML page and they work
> > perfectly.  Our issue is that all of the link that get returned in the
> > "searchResults" DIV fail to open in a fancy box.
>
> > NOW, if i include the javascript code for the fancybox along with the
> > fancybox.js and the jquery.js with the HTML in to the searchResults
> > div the fancybox links work perfectly.  Problem here is that the

> >searchresults are delivered as a person types and javascript crashes

JaneJam

unread,
Nov 30, 2012, 2:51:13 AM11/30/12
to fanc...@googlegroups.com
I have a same problem.
Is the page with search results of products divided a few pages (navchain).
But fancybox works only on first page because rest pages loads by Ajax/
Did You solve Your problem?maybe can help solve me and mine/
Thanks.

JFK

unread,
Nov 30, 2012, 9:09:45 PM11/30/12
to fanc...@googlegroups.com
@JaneJam

You must be using fancybox v1.3.4, don't you?
If so, that version doesn't support dynamically added elements (ajax)
Check this for a workaround
Reply all
Reply to author
Forward
0 new messages