Forums › Forums › Search & Filter Pro › Reload other elements when use ajax

Tagged: 

Viewing 2 posts - 1 through 2 (of 2 total)
  • Anonymous
    (Private)  February 6, 2016 at 1:26 pm #36389

    Hi,

    I think that this question probably are a little about of scope, but is a problem that will affect more users in future. I’m trying to use search and filter pro with ajax and a plugin called WP image zoooom. The problem is when I use the ajax they not reload the images in WP Images Zoooom as you can see here and here.

    I already try the support for WP Image and this is what I get

    basically the javascript zoom object needs to be reloaded when the page changes. You can try contacting the Search & Filter Pro and ask them to hook the following code when presenting the product details page:

    jQuery(document).ready(function( $ ){
    var options = {<?php echo get_option( 'zoooom_settings_js' ); ?>};
    $(".zoomContainer").remove();
    $(".attachment-shop_single").image_zoom(options);
}

    Also they would need first to check if the WP Image Zoooom plugin exists with:
    if ( class_exists( ‘ImageZoooom’ ) ) in PHP, or:
    if ($.fn.image_zoom) in JavaScript. Whichever one fits into their code.

    Can you give me any help?

    Thanks

    Ross Moderator
    (Private)  February 8, 2016 at 11:36 am #36455

    Hey Miguel

    Check the first question here:

    https://www.designsandcode.com/wordpress-plugins/search-filter-pro/faqs/

    You want the code for the event sf:ajaxfinish –

    1) so you add the above link to your theme,
    2) use the code for WP image zoooom inside the event handler

    jQuery(document).ready(function( $ ){
	var options = {<?php echo get_option( 'zoooom_settings_js' ); ?>};

	$(document).on("sf:ajaxfinish", ".searchandfilter", function(){
		console.log("ajax complete");
		//so load your lightbox or JS scripts here again
		$(".zoomContainer").remove();
		$(".attachment-shop_single").image_zoom(options);
	});
}

    Depends on how you are adding your JS, but I see a potential problem in their code (which I copied into my example) which may cause you some errors depending on if your JS is loaded inside an external JS file or inline in your site.

    Thanks

  • Author
    Posts
Viewing 2 posts - 1 through 2 (of 2 total)