I have an example here: When I'm submitting the form, I want to save the tab ID and ID of the div that is currently selected so I do not need to bring it into the input of the hidden type
<script type="text/javascript">
$(document).on('click','.btn-enviar',function(){
//DÚVIDA COMO PEGAR A ABA QUE FOI SELECIONADA NO nav-tabs
if (typeof(Storage) !== "undefined") {
localStorage.setItem("abaatual", "aba");
aba_atual = localStorage.getItem('abaatual');
}
});
function AdicionarClasseMenuSelecionado(){
var menuatual = document.getElementById('MenuSelecionado').value;
var abaatual = document.getElementById('AbaSelecionado').value;
alert("Menu Selecionado : "+menuatual);
alert("Aba Selecionado : "+abaatual);
//remove todos os active do cabecalho
$("ul.nav.nav-tabs li").removeClass("active");
//remove todos os active do content
$('.tab-content').find('.tab-pane').removeClass('active in');
//adiciona o active que retornou
$("#"+menuatual).addClass("active in");
$("#"+abaatual).addClass("active");
};
$(document).ready(function(){
var menuatual = document.getElementById('MenuSelecionado').value;
if (menuatual == "") {
alert("não foi enviado nenhum menu no input");
} else {
AdicionarClasseMenuSelecionado();
}
});
</script>
<div class="container">
<input name="MenuSelecionado" type="hidden" value="andamentos" id="MenuSelecionado">
<input name="AbaSelecionado" type="hidden" value="aba2" id="AbaSelecionado">
<form action="#" method="POST" class="form-horizontal" role="form">
<div class="form-group">
<legend>Cadastro Teste</legend>
</div>
<ul class="nav nav-tabs">
<li class="active" id="aba1" ><a data-toggle="tab" href="#encerramento">Encerramento</a></li>
<li id="aba2" ><a data-toggle="tab" href="#andamentos">Andamentos</a></li>
<li id="aba3"><a data-toggle="tab" href="#valores">Valores</a></li>
</ul>
<div class="tab-content">
<div id="encerramento" class="tab-pane fade active">
<h3>Encerramento</h3>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
</div>
<div id="andamentos" class="tab-pane fade ">
<h3>Andamentos</h3>
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam.</p>
</div>
<div id="valores" class="tab-pane fade ">
<h3>Valores</h3>
<p>Eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.</p>
</div>
</div>
<div class="form-group">
<div class="col-sm-10 col-sm-offset-2">
<button type="submit" class="btn btn-primary btn-enviar">Submit</button>
</div>
</div>
</form>
</div>