Possible to add a loading icon?

Anonymous

#12401

I don’t know if this is a support question because the feature already exists, or if it’s a feature request because it doesn’t yet exists. I’m using your plugin for a Resource Library (http://blog.redbranchmedia.com/resource-library/). The only problem is that the results take 5-10 seconds to load. Is it possible to have a loading icon while it’s loading so the user knows the page isn’t blank? Thank you

Anonymous

#12405

For now, I just added a gif as a background image via CSS.

Ross Moderator

#12407

Hey Jeremy

Phew – I was horrified at those loading times – luckily I just tested it was averaging at just over 3 seconds 😉

To answer your question – there are some javascript events which detect when the results are being loaded, and when they have finished loading (see the top question) –

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

This means you can use JS to show or hide your loaded whenever you need to!

Thanks

Anonymous

#12409

Thanks for the super quick reply! It probably *felt* more like 5-10 seconds without an icon. 🙂 Thanks for the link. That will work!

Anonymous

#15900

Did this hook change with the latest update? I updated to the latest version 1.4.2 and the script isn’t working anymore.

Ross Moderator

#16311

Hey Jeremy

Nope, this didn’t change.

WP 4.2 broke some things with S&F, and the previous S&F update had some bugs.

Please update to S&F 1.4.3 and let me know if you are still experiencing problems.

Thanks

Anonymous

#16329

Hey Ross,
Thanks for the reply. I updated, but unfortunately that didn’t do anything to fix this issue. Here is the script I’m using. It was working as expected until I updated.

$(".searchandfilter").on("sf:ajaxfinish",function(){
$(".search-filter-results").css("background", "none");
});

I also tried using the scripts from this page, but nothing was registered in the console. http://www.designsandcode.com/wordpress-plugins/search-filter-pro/faqs/

$(".searchandfilter").on("sf:ajaxstart",function(){
console.log("ajax start");
});

$(".searchandfilter").on("sf:ajaxfinish",function(){
console.log("ajax complete");
//so load your lightbox or JS scripts here again
});

I appreciate your help. Thanks!

Ross Moderator

#16341

Hi Jeremy

I’ve just tested this on several installs (just copy and paste) and seems to work fine…

Do you have a link I could look at?

I’m thinking that it may not be updating S&F that has caused the issue.

Likely, when updating WP you would have to update several other plugins too? If this is the case, one of these updates could cause a JS error, which could prevent S&F from operating correctly.

Check you JS console for errors, and if there are any you should get these fixed (let me know if any are coming from S&F!).

Thanks

Anonymous

#16346

Hey Ross,
Thanks again for the quick reply. I appreciate you going above and beyond to support this. You can see it in action here: http://blog.redbranchmedia.com/resource-library/

I added a white background to the .resourcecontainer div to cover up the gif. However, if you look at the source code, you’ll see that the the inline CSS for the .search-filter-results div is not changing to background:none;

It’s in the rbmscripts.js file if you’re searching the source code to get a view. I don’t currently have any script errors in the console.

It potentially could be interferance with another plugin. I will test that in my local dev and let you know if I find anything.

Thanks again!

Ross Moderator

#16350

Hi Jeremy

I added this code the the JS console:

jQuery(".searchandfilter").on("sf:ajaxstart",function(){
console.log("ajax start");
});

jQuery(".searchandfilter").on("sf:ajaxfinish",function(){
console.log("ajax complete");
//so load your lightbox or JS scripts here again
});

And I’m getting the relevant logs when ajax begins/finishes…

This means it must be working, there must be another problem with your scripts or somewhere in your theme.

Thanks

[Author]

Posts