Making buttons that change the tab in a menu of type Bootstrap nav-tabs

Question

Making buttons that change the tab in a menu of type Bootstrap nav-tabs

Navigation

#1 by (0 votes)

1

I currently have the following code: link

The following JavaScript code is intended to cause the buttons with the words "Previous" and "Continue", respectively, to return and advance a tab. But clicking does not happen.

<script type="text/javascript">
    function prox(){
        $('.nav-tabs').find('.active').next('li').find('a').trigger('click');
    }
    $('#btnA').click(function(){
        $('.nav-tabs').find('.active').prev('li').find('a').trigger('click');
    })
</script>

The buttons:

<div class="text-right">
    <button type="submit" class="btn btn-primary" onclick="prox()">Salvar e Continuar</button>
    <button type="button" class="btn btn-outline-secondary" id="btnA">Anterior</button>
</div>

javascript html5 twitter-bootstrap aba

asked by anonymous 29.05.2018 / 22:51

1 answer

How do I access the date-weekday property of the div element with javascript? Why does not DontDestroyOnLoad change when I change the scene?

score 0 · Accepted Answer

Change the event:

$('#btnP').onclick(function(){
 $('.nav-tabs').find('.active').prev('li').find('a').trigger('click');
})

to ...

$('#btn').click(function(e){
   e.preventDefault(); // evita o submit
   $('.nav-tabs li a.active') // busca o <a> ativo
   .closest("li") // busca o <li> pai do <a> ativo
   .next(".nav-item") // seleciona o próximo <li>
   .find("a") // busca o <a> do próximo <li>
   .trigger('click'); // dispara o clique
});

Where #btn is the id of the Load and continue button and you need to select the parent of the <a> link to select the next <a> link within the next <li> .

e.preventDefault(); prevents the page from being reloaded by submit .