13
Nov '16
Remember Selected Bootstrap Tab Using Location Hash/Anchor
Easy one this, just copy and paste code if you’re using Bootstrap.
Whenever a tab is changed, this code will take its ID from the trigger and put into the window location hash (AKA address anchor or, if you’re really posh, the fragment identifier).
//Remember tab state $('ul.nav-tabs > li > a').on('shown.bs.tab', function(e) { if($(e.target).attr('href')) { var id = $(e.target).attr('href').substr(1); window.location.hash = id; } });
The second section of code ensures that whenever the page is reloaded, or the page is linked to using a valid tab ID, the identified tab will be selected automatically.
//Switch tab state if (window.location.hash) { $("a[href='" + window.location.hash + "']").tab('show'); }
Done