1

Tenho cinco abas, e cada uma exibe ou não o resultado de uma consulta no banco.

<div class="container">  
  <ul class="nav nav-tabs">
    <li class="active">
      <a data-toggle="tab" class="nav-link" href="#basic">Basic</a>
    </li>
    <li class="nav-item">
     <a data-toggle="tab" class="nav-link" href="#gold">Gold></a>
    </li>
     .
     .
     .
</ul>

a aba basic é ativada quando carrega a pagina:

 <script>
    $(document).ready(function(){
        $('a[href="#basic"]').tab('show');
    });
</script>

Ocorre que como cada aba é o resultado de uma consulta, pode ocorrer de a aba "basic" não conter dados nenhum para exibir, e as demais sim.

inserir a descrição da imagem aqui

Procuro uma solução para exibir a primeira aba com resultado, ao carregar a pagina

NOTA: Utilizo ListView para exibir os dados.

7
  • Qual o HTML da aba?
    – Sam
    Commented 27/02/2019 às 20:24
  • <div class="tab-content"> <div id="basic" class="tab-pane fade in active">
    – Daniel
    Commented 27/02/2019 às 20:26
  • Tenta isso: $(document).ready(function(){ $('.tab-pane').each(function(){ if($(this).children().length){ $('a[href="#'+ this.id +'"]').tab('show'); return false; } }); });
    – Sam
    Commented 27/02/2019 às 20:39
  • @Sam abriu a aba "basic", que é a primeira. No teste, essa aba não poderia abrir, pois não continha dados da consulta, e as outras sim. Retornou apenas a mensagem de retorno do <EmptyDataTemplate> do ListView.
    – Daniel
    Commented 27/02/2019 às 20:44
  • Será que verificando se contém algum texto na aba funciona?
    – Sam
    Commented 27/02/2019 às 20:45

1 Resposta 1

0

Conforme conversado no chat, basta procurar nas guias das abas o primeiro valor diferente de 0 na tag <sup>:

<li class="active"> 
   <a data-toggle="tab" class="nav-link" href="#basic">
      Basic <sup><% Response.Write(Basic);%></sup>
   </a> 
</li>

inserir a descrição da imagem aqui

$(document).ready(function(){
   $('a[data-toggle=tab]').each(function(){
      if(Number($("sup", this).text())){
         $(this).tab('show');
         return false;
      }
   });
});
4
  • se todos forem "0" tem que abrir uma delas para mostrar a mensagem do ListView que não há dados nessa visão e etc. Faltou esse detalhe apenas.
    – Daniel
    Commented 27/02/2019 às 21:22
  • Ah sim... vou ver aqui
    – Sam
    Commented 27/02/2019 às 21:23
  • 1
    Dá uma olhada no código: jsfiddle.net/kyq5dcao
    – Sam
    Commented 27/02/2019 às 21:26
  • Perfect. Exatamente o comportamento esperado. Muito obrigado.
    – Daniel
    Commented 27/02/2019 às 21:28

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .