Click the button running as many times as you have tabs

Asked

Viewed 55 times

0

I have the following situation:

<ul class="nav nav-tabs">
<li class="active"><a data-toggle="tab" href="#segunda_tab" ><?php echo $array_dia_da_semana_s[0] ?></a></li>
<li><a data-toggle="tab" href="#terca_tab"  ><?php echo $array_dia_da_semana_s[1] ?></a></li>
</ul>

<div class="tab-content">
<div id="segunda_tab" class="tab-pane tab tab-label fade in active">
    <?php
        $id_linha_tabs = 1;
        echo("<font size='5' style='font-weight:bold;'>" . $array_dia[0] . "</font>");                      
        $data_string = $array_dia[0];
        $dia_da_semana = 0;
        $id_da_tabela = 0;                      
        include('consulta_01_dds.php');                                             
    ?>  
</div>

<div id="terca_tab" class="tab-pane fade">
  <?php
        echo("<font size='5' style='font-weight:bold;'>" . $array_dia[1] . "</font>");                      
        $data_string = $array_dia[1];
        $dia_da_semana = 1;
        $id_da_tabela = 1;                      
        include('consulta_01_dds.php');     
  ?>
</div>
</div>

In the query file 01_dds.php I have the following code:

<br>
<table>
    <td>
        <tr>
            <?php echo($dia_da_semana)?>
        <button class="button1" id="<?php echo($dia_da_semana)?>"><?php echo($dia_da_semana)?>
        </tr>
    </td>
</table>    
<br>


<script>    
     $(function()
    {   
        $('.button1').click(function()
        {
            bb = $(this);
            $(".tab-content div").each(function( index ) 
            {
                if($(this).attr('class').indexOf('active') != -1)
                {   
                    alert(" B Indice3: " + index+ ' value..: '+ $(bb).val()+ ' - id '+ $(bb).attr('id'));

                }
            });
        });
    });

</script>

Everything works as it should at first. The tabs appear, each content of the tab in its respective place, however when I press the button1 class button the click returns the alert with the information I asked correctly, the problem is that it returns me as many times as the tabs I put. In this case the alert appears 2 times.
Example.. If I add another LI with href="#quarta_feira" and its respective div id="quarta_feira" then click will make Alert appear 3 times..
Is the logic wrong? This is not how you use Nav-tabs and tab-pane?
Thank you for your attention.

  • What is the following situation?

  • Good afternoon Lucas Costa.. The problem is that the click is running as many times as I had tabs.. and theoretically :) would have to be a click an action.. Hugs :)

  • The loop will run the number of times there are elements .tab-content div.

  • @DVD... What a loop?????

  • @DVD NOW I understood what you said :) So to solve the problem I simply TOOK the <script> </script> from inside the query page_01_dds.php and put it on the page that calls include.. Then the click of the button started to respond correctly :) .. Dear THANK YOU for the light. I am inexperienced in this business of php. Again.. Thank you. Thank you.

  • @DVD Dude...the solution I mentioned above only worked for the first tab (index 0). all other buttons of the other TABS do not trigger the script..

  • Wait till I check it out.

  • That one $(bb).val() is what?

  • @DVD is what’s written on the boot

  • You’re wrong about that. First thing is to close the tag <button></button>... then to get what is written on the button you must use $(bb).text().

  • I ran a test here, and the buttons work normally. The ideal is you edit your question and put part of the HTML already returned by PHP, that is, the pure HTML with the PHP values already returned.

  • Look at the test roughly as I did: https://jsfiddle.net/ykr4m01c/

Show 8 more comments
No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.