Search & Filter Pro failing to work for me

Eamonn Keenan

#91147

Hi there,

Search & Filter Pro continuously seems to fail for me. Every time it seems to be working, I perform a search and I don’t get back the expected results. I’ve had to go back to the functionality a few times to investigate the problem and I am getting close to removing the search from my site now. This is not something I wish to do however as I have invested money in this search.

I was hoping that you could take a look at my site to see what could be going wrong with the search. The search is currently available on this page: https://www.thehomeoffitness.com/shop/

Regards,
Eamonn.

Add New Note to this Reply

Ross Moderator

#91149

Hi Eamon

If I take a look at that page, I can see there are various Javascript errors (coming from the slider)

It looks like the “weeks” slider is not initialising properly.

What are you setting as min / max for your weeks? If you have “auto detect” for min / max of the weeks, and your results don’t have data for those fields, that might be why its causing an issue.

Try setting your min / max for the weeks field manually and see if you get the issue?

Thanks

Add New Note to this Reply

Eamonn Keenan

#91151

Thanks very much for the quick response Ross.

I have set to min and max values to 0 and 50 respectively. This appears to have fixed the issue.

I have also not been able to load my results using AJAX. Do you have any clues as to why this could be?

Add New Note to this Reply

Ross Moderator

#91156

Hey Eamonn

You’re lucky you caught me working on a sat night 😉

Take a look at the setup instructions for ajax:
https://www.designsandcode.com/documentation/search-filter-pro/search-results/#Setting_Up_Ajax

Depending on if your layout needs JavaScript to work this might not be straight forward.

Anyway, if you want to use ajax, you must specify a valid “ajax container”, it looks like you could try using #content as your ajax container to get it working, but I think a better option is below:

If you are using an EDD downloads shortcode [downloads] then you would wrap this in a div with an ID (goto html view in WP Editor), so it would become : <div id="sf-results">[downloads]</div>

Then in S&F, under display results you would set your ajax container to #sf-results

This would get Ajax working..

However… If your layout needs JavaScript to work properly (I can’t remember if EDD does), then you will need to re-initialise the javascript that is needed here (its a bit more complicated and requires adding some JS to your theme).

Anyway, as its EDD I am happy to look into to find out, if it is required.

(I may not be back on this weekend to reply but I’ll try to keep my eye out for this one)

Best

Add New Note to this Reply

Eamonn Keenan

#91169

Cheers Ross.

The #content solution didn’t work for me but your div solution did.

It has created a display problem though whereby when the results of the search are shown, the gap between downloads disappears. The effect is a layout which isn’t as nice as when the user initially lands on the page. Any ideas what might be causing this?

Add New Note to this Reply

Ross Moderator

#91364

Hi Eamonn

I’ve spent a good while looking at this now.

Essentially its what I described above.

When you load the page for the first time, your get the nice grid layout. This is because Marketify runs some JavaScript when the page loads to do this.

When we do an ajax request with Search & Filter, we replace the html for the results, but what hasn’t happened is the re-layout magic that Marketify does on a page load.

Fortunately, we have a javascript event to detect when results are loaded in via ajax:

(function ( $ ) {
	"use strict";
	
	$(document).on("sf:ajaxfinish", ".searchandfilter", function(){
		console.log("ajax complete");
		//need to re-intialise the code for doing the Marketify layout here
	});
}(jQuery));

What we need to do is add the javascript code that Marketify uses for laying out the grid where it says //need to re-intialise...

I’ve gone through their code to see if I can see the magic snippet but no luck.

Perhaps you can open a thread on their forums, referencing this one, and hopefully they can provide the code snippet we need.

Hope that helps

Add New Note to this Reply

Eamonn Keenan

#92032

Hi Ross.

Marketify have come back to me and said that “the files that help display the widget itself are the following: edd_templates/shortcode-content-image.php and edd_templates/shortcode-content-title.php. If you are looking for Javascript files, you can find them under the JS folder. In particular : marketify/js/app/marketify.js and marketify/js/widgets/featured-popular.js”.

I’m not sure if they are saying that the grid layout code is within the .php files or if they are in the javascript files.

I have had a look at the javascript files but I’m finding it difficult to make much sense of them. Would you like me to grab you any of these files?

Regards,
Eamonn.

Add New Note to this Reply

Ross Moderator

#92555

Hi Eamonn

I’m afraid I had already got that far.

What we need is the JavaScript function, and I’ve gone through their JS files already, but can’t really make heads or tails of it.

What we need is the JS function to initialise the masonry layout on the shop, which I would hope would be something like:

$('selector').masonryFunction();

The best people to find this out would be the devs of Marketify.

I can’t see how to do it, therefor for now I have to say at this time it looks like its not possible to reload items in the shop using Ajax in Marketify (and I suspect this would be the same for any other plugin wanting to do some dynamic reloading of the shop, as they too would need access to this function).

Hope that helps – my hands are tied in this instance.

Best

Add New Note to this Reply

Eamonn Keenan

#94159

Hi Ross,

I come bearing gifts from Marketify. They are good guys like you and have been able to help me out.

Their layout is found specifically in this file: https://github.com/rnmp/salvattore
You can call this to your Search Filter AJAX : recreateColumns

Adding something similar like this will help reinitialize the grid after sorting: https://gist.github.com/spencerfinnell/cdd60da2e53abc3d65b1418ca4b18101

What do you think? Will it work?

Regards,
Eamonn.

Add New Note to this Reply

Ross Moderator

#94361

Yup perfect

Add this to your themes JS:

(function ( $ ) {
	"use strict";
	
	$(document).on("sf:ajaxfinish", ".searchandfilter", function(){
		var grid;
		$(el).find($('.edd_download.content-grid-download')).attr('style', '');
		grid = document.querySelector(el);
		salvattore['register_grid'](grid);
	});
}(jQuery));

Let me know that works ok, its working locally just fine 🙂

Add New Note to this Reply

[Author]

Posts