Skip Navigation

[Resolved] Lightbox not working with ajax parametric search

This thread is resolved. Here is a description of the problem and solution.

Problem:
How to make responsive lightbox work with views ajax parametric search

Solution:
To make lightbox work with ajax parametric search, you need to adjust your javascript callback functions using views.

See screenshot:
https://nimbus.everhelper.me/client/notes/share/399783/8gx96pq4lsemos4setpk

You can find the suggested solution with the following reply:
https://toolset.com/forums/topic/lightbox-not-working-with-ajax-parametric-search/#post-368326

Relevant Documentation:

This support ticket is created 8 years, 2 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
- 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 10:00 – 13:00 -
- 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 -

Supporter timezone: Asia/Kolkata (GMT+05:30)

Tagged: 

This topic contains 4 replies, has 2 voices.

Last updated by houfton 8 years, 2 months ago.

Assisted by: Minesh.

Author
Posts
#367989

I am trying to use a lightbox but it is not working with ajax parametric search when a filter is selected. It goes instead to the image post.

See this temporary site hidden link

The lightbox is a Fancybox implementation by this plugin hidden link but I have tried other versions with the same result.

Is it possible to have both or do I need to use a submit button with page reload?

#368139

Minesh
Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

Hello. Thank you for contacting the Toolset support.

I see your problem and its related to plugin and how it attached the lightbox events.

The option which you tell me to add submit button is the easiest way I think but I would like to give one shoot if that fix your issue.

*** Please make a FULL BACKUP of your database and website.***
I would also eventually need to request temporary access (WP-Admin and FTP) to your site. Preferably to a test site where the problem has been replicated if possible in order to be of better help and check if some configurations might need to be changed.

I would additionally need your permission to de- and re-activate Plugins and the Theme, and to change configurations on the site. This is also a reason the backup is really important. If you agree to this, please use the form fields I have enabled below to provide temporary access details (wp-admin and FTP).

I have set the next reply to private which means only you and I have access to it.

#368326

Minesh
Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

Finally - I've good news for your. I've to debug a bit more but finally we have result.

I've added following code to your view's JS box.

function calllightbox(){
 
  jQuery( 'a[rel*="' + rlArgs.selector + '"], a[data-rel*="' + rlArgs.selector + '"]' ).fancybox( {
					modal						: ( rlArgs.modal === '1' ? true : false ),
					overlayShow					: ( rlArgs.showOverlay === '1' ? true : false ),
					showCloseButton				: ( rlArgs.showCloseButton === '1' ? true : false ),
					enableEscapeButton			: ( rlArgs.enableEscapeButton === '1' ? true : false ),
					hideOnOverlayClick			: ( rlArgs.hideOnOverlayClick === '1' ? true : false ),
					hideOnContentClick			: ( rlArgs.hideOnContentClick === '1' ? true : false ),
					cyclic						: ( rlArgs.cyclic === '1' ? true : false ),
					showNavArrows				: ( rlArgs.showNavArrows === '1' ? true : false ),
					autoScale					: ( rlArgs.autoScale === '1' ? true : false ),
					scrolling					: rlArgs.scrolling,
					centerOnScroll				: ( rlArgs.centerOnScroll === '1' ? true : false ),
					opacity						: ( rlArgs.opacity === '1' ? true : false ),
					overlayOpacity				: parseFloat( rlArgs.overlayOpacity / 100 ),
					overlayColor				: rlArgs.overlayColor,
					titleShow					: ( rlArgs.titleShow === '1' ? true : false ),
					titlePosition				: rlArgs.titlePosition,
					transitionIn				: rlArgs.transitions,
					transitionOut				: rlArgs.transitions,
					easingIn					: rlArgs.easings,
					easingOut					: rlArgs.easings,
					speedIn						: parseInt( rlArgs.speeds ),
					speedOut					: parseInt( rlArgs.speeds ),
					changeSpeed					: parseInt( rlArgs.changeSpeed ),
					changeFade					: parseInt( rlArgs.changeFade ),
					padding						: parseInt( rlArgs.padding ),
					margin						: parseInt( rlArgs.margin ),
					width						: parseInt( rlArgs.videoWidth ),
					height						: parseInt( rlArgs.videoHeight )
				} );

}

And I've made few changes to your "Parametric Search Settings" and called above function "calllightbox". Please see following screenshot.
hidden link

I hope this solution help you to resolve your issue. Please feel free to open a new ticket for your each new question.

#368393

Thank you for your perseverance Minesh.

As I understand it you have put a 'manual' call to a javascript function which runs after updating the results and sets up the Fancybox arguments.

I don't know if you are finished debugging but it certainly seems to work!

I thought it might override any settings made in the lightbox plugin but it seems not to which is great.

This is all much more satisfactory than a search button and shows the flexibility of Toolset Views!

#609734
Screen Shot 2018-01-25 at 12.45.04.png
Screen Shot 2018-01-25 at 12.45.17.png

Sorry to raise this here but I have looked around and there is nowhere to ask about a problem with the support forum itself. For a while now I have been getting "hidden link" instead of actual links in support pages - see attached examples. It makes it very difficult to sort out problems for myself. Can you help? I am a paid-up user.

This ticket is now closed. If you're a WPML client and need related help, please open a new support ticket.