I'm using the tabs component from Bootstrap, and it seems to work fine, but when I go to a tab then leave it, the tab keeps the active class. So they won't work when I've gone through all of them. This is the code I have (I'm using Django)
<ul id="question-tabs" class="nav nav-tabs nav-justified" role="tablist" data-tabs="question-tabs">
<li role="presentation" class="active"><a href="#latest" data-toggle="tab">Latest</a></li>
<li role="presentation"><a href="#unans" data-toggle="tab">Unanswered <span class="badge">{{ total_noans }}</span></a></li>
<li role="presentation"><a href="#reward" data-toggle="tab">Most Rewarding <span class="badge">{{ reward | length }}</span></a></li>
</ul>
I haven't found the problem, I tried using the JS snippet Bootstrap provides...
$('#question-tabs a').click(function (e) {
e.preventDefault()
$(this).tab('show')
})
... but it didn't work. It may be a silly thing but I couldn't figure out. I appreciate any help.
If you want a live example of what I'm saying, go to https://seoq.swapps.io/qa/
Yes, it was a silly thing. In the base template the Bootstrap.js file that was being called was the one for version 4. Now it works. I'm sorry and thank you all.