Tabs module with instance of Page Builder with Livemesh Grids in it.

[Jérôme Meier]

Hi there

I try to use the Tabs module with three tabs and each one with an instance of Page Builder. This works well, e.g.: https://www.ectaveo.ch/neu/test/

But when I try to put a Livemesh Grid (from https://www.livemeshthemes.com/products/livemesh-siteorigin-widgets-pro/), only the Grid in the default tab will show up correctly. The grids in the other two tabs will not immediately…

Can you help on this? Maybe with some Ajax-Improvements?

Best regards
Jérôme

[Raghavendra]

The tabs do not work well when the elements inside them require Javascript to render them. This is because they are hidden through CSS which makes JS to not apply itself to these elements. You may need to put them sequentially.

[Jérôme Meier]

Ok, and how can I add them sequentially within pagebuilder?

[Raghavendra]

You just multiple rows in the page builder and add one grid each to each of the rows added.

[Jérôme Meier]

This will affect another layout, right?

I’d like to do it with tabs 🙂

[Raghavendra]

I am afraid it is not possible to do it with our tabs implementation. May be you can give a try with some of the other implementations of tabs including the ones provided by SiteOrigin itself.

[Jérôme Meier]

My configuration is already with the tabs solution of SiteOrigin. I figured out this:

<script>
  jQuery( function ( $ ) {
      $('.sow-tabs-panel').on('show', function() {
          if( $(this).find( '> :hidden' ) ) {
              $(this).find('.lsow-grid-container').isotope('layout');
          }
      });
  } );
</script>

It will reload the grid after changing the tab. That works. But the Filter of the grid will not reload. How can i reload them separately with javascript?

[Author]

Posts