Pergunta sobre o gerador de tabelas de dados por Supsystic do WordPress: tabelas com guias

Um usuário perguntou ?

Estou usando códigos de acesso para exibir tabelas nas guias Divi. A primeira aba carrega uma tabela no telefone no modo responsivo, mas quando abro outras abas todas as tabelas carregam como versões de desktop.

(@olesolo)

2 anos, 7 meses atrás

Descobri que uma função de retorno de chamada não funciona para que uma tabela de dados seja exibida: none;

(@supsysticcom)

2 anos, 7 meses atrás

Olá @olesolo

Você pode nos fornecer um link para uma página com tabelas de dados com guias? Isso nos ajuda a resolver seu problema mais rapidamente. Provavelmente um código ruim de seus plugins ou plugins, que você usa para criar guias, gerou essa pergunta. Você precisa desabilitar todos os seus plugins um por um e verificar o problema. Assim, você descobrirá qual plugin está causando o erro. Se isso não ajudar, tente mudar temporariamente para um tema padrão do WordPress.

(@olesolo)

2 anos, 7 meses atrás

Aqui esta ele Conexão. As abas estão na parte inferior da página. Tente abrir a segunda guia em um celular.

(@supsysticcom)

2 anos, 7 meses atrás

Olá, @olesolo Para exibir corretamente a tabela de dados na guia, você deve usar a função Data Tables com o plug-in Supsystic para atualizar tabela após abrir a aba. Aqui está um exemplo de código personalizado para usar tabelas de dados em guias:

<ul id="tabsList">
 <li><a href=" class="tabItem">Tab 1</a></li>
 <li><a href="#tabItemContent_2" class="tabItem" data-table_id="1">Tab 2</a></li>
 <li><a href="#tabItemContent_3" class="tabItem">Tab 3</a></li>
</ul>
<div id="tabItemContent_1">Some data</div>
<div id="tabItemContent_2">[supsystic-tables id=1]</div>
<div id="tabItemContent_3">Some data</div>
jQuery(document).ready(function() {
 var tabSection = jQuery('#tabsList');
 var app = window.supsystic && window.supsystic.Tables ? window.supsystic.Tables : false;
 // Check are Data Tables by Supsystic plugin API and tabs section exist on page
 if(tabSection.length && app) {
  // Find all tabs
  tabSection.find('.tabItem').each(function() {
   // Get table id
   var tableId = jQuery(this).data('table_id');
   // Check, is this tab contains table or not
   if(tableId) {
    jQuery(this).on('click', function() {
     // Call the function from Data Tables by Supsystic plugin to refresh table after the tab opening
     if(typeof app.getTableInstanceById(tableId).fnAdjustColumnSizing == 'function' ) {
      app.getTableInstanceById(tableId).fnAdjustColumnSizing(false);
     }

    });
   }
  });
 }
});

Experimente e nos conte os resultados.

(@olesolo)

2 anos, 7 meses atrás

não funciona ?

(@olesolo)

2 anos, 7 meses atrás

Eu tentei este código com um link direto para tabId

jQuery(document).ready(function() {

 //jQuery('.et_pb_tab_1').attr('data-table_id', '1');
 var tabSection = jQuery('.et_pb_tabs_controls');
 var app = window.supsystic && window.supsystic.Tables ? window.supsystic.Tables : false;
 
 // Check are Data Tables by Supsystic plugin API and tabs section exist on page
 if(tabSection.length && app) {
  // Find all tabs
  tabSection.find('.et_pb_tab_1').each(function() {
   // Get table id
   var tableId = 1;
   // Check, is this tab contains table or not
    jQuery(this).on('click', function() {
     // Call the function from Data Tables by Supsystic plugin to refresh table after the tab opening
     if(typeof app.getTableInstanceById(tableId).fnAdjustColumnSizing == 'function' ) {
      app.getTableInstanceById(tableId).fnAdjustColumnSizing(false);
     }
   });
  });
 }
});

(@supsysticcom)

2 anos, 7 meses atrás

Olá @olesolo

Você pode especificar o que exatamente não está funcionando: a tabela de guias ainda não está respondendo ou desde que o código não funcione para você?

(@olesolo)

2 anos, 7 meses atrás

a tabela de guias ainda não está respondendo.

(@supsysticcom)

2 anos, 7 meses atrás

Por favor, escreva-nos através suporte interno e nós forneceremos uma correção.

(@olesolo)

2 anos, 6 meses atrás

Ainda não consigo resolver este problema. Não consigo adicionar atributos de id às minhas guias. Você poderia adicionar algum código simples para “Executar script JS após o carregamento da tabela” para recarregar a tabela?

(@supsysticcom)

2 anos, 6 meses atrás

Olá @olesolo

Já aprimoramos o código necessário para exibir a tabela de dados corretamente nas guias e adicionamos uma configuração de código de plugin. Segue o link de um guia:

Se você ainda tiver problemas com isso, por favor, escreva-nos via suporte interno e tentaremos fazê-lo funcionar especialmente para você.

(@olesolo)

2 anos, 6 meses atrás

Minha solução rápida é alterar a classe da tabela ao clicar se a largura da janela for pequena.

if (jQuery(window).width() < 480) {
            jQuery('div.et_pb_tab table').attr('class','supsystic-table border stripe hover order-column lightboxImg no-border  dataTable no-footer oneColumn oneColumnWithLabels');
          }