How to leave active bootstrap tab after clicking pagination?

When a page is reloaded, its previous state is lost. So, according to the snippet where you set the Configuração as active , the behavior you get, to get the first ever active tab, is as expected.

If you change your page to activate the "Users" tab by default, the reverse will be true, that is, this tab will always be displayed:

<ul id="tabs_sistem" class="nav nav-tabs">
    <li id="tab_perfil"><a href="#perfil" data-toggle="tab">Configurações</a></li>
    <li id="tab_alunos"  class="active"><a href="#alunos" data-toggle="tab">Usuários</a></li>
</ul>

One solution to this is to include logic in your server code, in the case of PHP, to decide which tab should be activated when the page loads. See the following example:

<?php
$aba_atual = //sua lógica vai aqui
?>
<ul id="tabs_sistem" class="nav nav-tabs">
    <li id="tab_perfil" <?php if ($aba_atual == 0) { ?> class="active"<?php } ?>>
        <a href="#perfil" data-toggle="tab">Configurações</a>
    </li>
    <li id="tab_alunos" <?php if ($aba_atual == 1) { ?> class="active"<?php } ?>>
        <a href="#alunos" data-toggle="tab">Usuários</a>
    </li>
</ul>

That way you do not need any scripts.

On the other hand, you can also do this via javascript when adding a parameter to the URL.

$(function(){

    //seleciona a aba baseando-se na URL atual
    var url = document.location.toString();
    if (url.match('#')) {
        $('.nav-tabs a[href=#'+url.split('#')[1]+']').tab('show');
    } 

    //muda a url ao clicar numa aba
    $('.nav-tabs a').on('shown', function (e) {
        window.location.hash = e.target.hash;
    })
});

The problem here is that the action attribute of the form is fixed, and by doing submit , the URL will not carry the parameter with the currently selected tab. Alternatives to solve could be:

• Place a hidden field on the form that sends the selected tab to the server. So the above PHP code could retrieve the value of that field.
• Store which tab is selected in Cookie and retrieve this value at page initialization.

Looking for the best implementation I found in stackoverflow for a need I had last week I got to this response

See the difference of event shown and shown.bs.tab

Bootstrap 2

// Javascript to enable link to tab
var hash = document.location.hash;
var prefix = "tab_";
if (hash) {
    $('.nav-tabs a[href='+hash.replace(prefix,"")+']').tab('show');
} 

// Change hash for page-reload
$('.nav-tabs a').on('shown', function (e) {
    window.location.hash = e.target.hash.replace("#", "#" + prefix);
});

Bootstrap 3

// Javascript to enable link to tab
var hash = document.location.hash;
var prefix = "tab_";
if (hash) {
    $('.nav-tabs a[href='+hash.replace(prefix,"")+']').tab('show');
} 

// Change hash for page-reload
$('.nav-tabs a').on('shown.bs.tab', function (e) {
    window.location.hash = e.target.hash.replace("#", "#" + prefix);
});

I believe that in this answer you will find several ways to do it and you can find the one that fits best in your project.

So what happens is that when you use PHP pagination, you're doing post to load the new page ... You would need to make this page via JavaScript or add a Ajax call to your PHP , an example call Ajax , with jQuery :

$.ajax({
  url: "test.html",
  context: document.body
}).done(function() {
  $( this ).addClass( "done" );
});

I can not give you a more accurate code because you did not provide any details of your code in PHP .

Friend you can implement this function:

function getURLParameter(name) {
    return decodeURI(
        (RegExp(name + '=' + '(.+?)(&|$)').exec(location.search)||[,null])[1]
    );
}

That will capture parameters, and in the links of the page that point to itself you can put something like ?tab=usuarios

Then in the onload of the page something like:

$(function(){
   var tab = getURLParameter('tab');
   if(tab != undefined && tab == 'usuarios')
      $('a[href=//#alunos]').trigger('click');
})

And voila!

Via PHP is even easier,

Let's suppose you passed your link via get in the URL, just at the time of rendering the page do something like this:

<?php
   $tab = $_GET['tab'] == 'usuario' ? 1 : 0;
?>

Then in the tabs:

<ul id="tabs_sistem" class="nav nav-tabs">
  <li id="tab_perfil" <?php echo $tab == 1 ? '' : 'class="active"';?>>
    <a href="#perfil" data-toggle="tab">Configurações</a>
  </li>
  <li id="tab_alunos" <?php echo $tab == 1 ? 'class="active"' : '';?>>
    <a href="#alunos" data-toggle="tab">Usuários</a>
  </li>
</ul>