NO BUG: Query loop, Popup, JetSmartFilters problem

Bugs
1

I have a Query loop that lists CPT data, and element to trigger Popup with post details. Everything works fine until I apply the filter created with JetSmartFilters. With the filter applied interaction is not working until the page is refreshed. Link: Jam
Is it just with JetSmartFilters or is it a case with other facets?
Any help is much appreciated.

2

Hi Goran,
Thanks so much for your report!

Would you be so kind as to send temporary login credentials and a link to this thread to help@bricksbuilder.io using the email address you used during the purchase?

Best regards,
timmse

3

Hi @tole011 ,

Thanks for the login details via email.

Just checked your test page. The button with interactions is not working after the JetSmartFilter fired, it is because the plugin just replaced the DOM without reinit the interactions JavaScript.

You might need to contact JetSmartFilter plugin team to address this issue.
They can execute bricksInteractions() after the DOM replacement method.

Thanks.

Regards,
Jenn

4

The code we used to add support for JetSmartFilters was…

document.addEventListener( 'jet-smart-filters/inited', function( initEvent ) {
    window.JetSmartFilters.events.subscribe( 'ajaxFilters/updated', function( provider, queryId ) {

     /* code to run when filters are updated here */

   } );
} );

You could try running the bricksInteractions() function inside there.

5

@itchycode Thanks for your time. I’ll do that.

@wplit Thamks for the tip, but that is above my level… :wink:

Best regards,
Goran

6

Hi Jenn,

I’ve contacted Crocoblock support and this is their answer:

"The development team has checked this case.

Currently, the algorithm is like this:

  1. Filtering of the selected correct magnifier for additional smart filters.
  2. After filtering, we need to regenerate the scripts (in this situation, popup) for this particular loop.
  3. And then the popup will work.

But, in Bricks, we cannot reinit scripts for a specific widget/node.
The initialization is written by them in such a way that when the required method is launched, it hooks all widgets/nodes on the page (in this case Bricks loop).

This is not the first situation with reinit.
We already wrote to their support and they replied that they are thinking about solving this issue and should complete it in the near future."

Any comment?

Best regards,
Goran

7

Hi Goran,

Yup, reinit some JS will cause issues in the previous Bricks version.
And that’s the reason we rewrite the whole JavaScript in 1.8
It will be safe to reinit the interactions in 1.8 now :slight_smile:

image
image989×415 33.3 KB

Regards,
Jenn

8

Hi Jenn,

Thanks for your response. I’m sorry, but what must I do to make it work?

Regards,
Goran

9

Hi Goran,

If you want to solve it by custom code, you can use the code provided by @wplit

Place this in a code element on that page, and try.

document.addEventListener( 'jet-smart-filters/inited', function( initEvent ) {
    window.JetSmartFilters.events.subscribe( 'ajaxFilters/updated', function( provider, queryId ) {

     bricksInteractions();

   } );
} );
10

Hi Jenn,

Will do. Do I have to change anything and what? I’m no coder but can follow instructions.

Regards,
Goran

11

Hi Jenn,

Disregard the previous message. Code is working!!! Thanks to @wplit and you.
Have a nice weekend.

Best regards,
Goran

12

EDIT: Popup is triggering but pulls data from the first items in the loop.
Let’s say there are 30 items. After filtering there are items 10, 12, 15. When trigger popup on item 10 it pulls data from item 1, on item 12 from item 2, on item 15 item 3…

Any idea how to solve this?

Regards,
Goran

13

Hi @itchycode ,

Hate to be that person, but I have to solve the problem. Please can you point me in the right direction on how to solve this?

Best regards,
Goran

14

Hi Goran,

It seems like JetSmartFilters didn’t fetch and replace the looping popup templates after the filter.

A bit of technical explanation:
You should be able to notice there are .brx-popup before the end of the on the initial load of the page.

However, after each filter results by the plugin, the popups in the current page are still the same without being “filtered”. Hence, clicking on the filtered result will cause the wrong popup to be triggered.

I am afraid this has to be solved by the plugin author.

You could do some tests without using the filter plugin, just create a query loop + popup template like what you did. Set posts per page like 4, add a pagination element + AJAX enabled.
Everytime you navigate to different pages (AJAX), you will notice that popups will be fetched from Bricks AJAX and replaced and same to the results. This will ensure the Interactions trigger correctly.

Regards,
Jenn

15

JFYI, with the latest updates from Crocoblock and BricksBuilder (1.9.4) everything is working as expected (for me at least).