₦airaland Forum

Hey guys! I have these tabs. Mainly HTML, CSS and Vanilla JS which I got from W3schools. It displays different items on click but I want it to stay on a active tab even if the page is refresh.

https://codepen.io/karlebh/pen/LYxQyLW?editors=1000

I am really confused at this one.

I am thinking local or sessionStorage would be a better fit but I can't just wrap my head around the implementations.

Karleb:
Hey guys! I have these tabs. Mainly HTML, CSS and Vanilla JS which I got from W3schools. It displays different items on click but I want it to stay on a active tab even if the page is refresh.

https://codepen.io/karlebh/pen/LYxQyLW?editors=1000

I am really confused at this one.

I am thinking local or sessionStorage would be a better fit but I can't just wrap my head around the implementations.

I think localStorage or sessionStorage will work. I'd go for localStorage given that it is permanent.

When a tab is clicked, save the reference of the clicked tab in localStorage in such a way that the reference to the recently clicked tab always overwrites the reference to the previously clicked tab. All these happen in the localStorage.

With this, tweak your code to always load the reference to the last active tab from the localStorage upon reload/refresh. This way, the active status will be triggered on the reference loaded from the localStorage.

I am not sure if this would help completely but I am sure you would be able to pick something from it.

Well done bro.

Don't know if it's possible though. Mine was to display data from my database onclick. Lemme checkout this local storage