CODEWITHSUNDEEP
javascriptjqueryhtmlcss
ZombieChowder
ZombieChowder

Reputation: 1204

Retain Focus on Reloading Html Element

I am trying to create several pages which have the same accordion side menu. My issue is that whenever I access one page from another, I lose the focus of the side menu element that I've clicked.

I know that this is due to the fact that the DOM reloads in the browser whenever I change the page and renders the elements from the start.

enter image description here

My file structure goes like this:

main.html (root file)
|
|
Pages (sub-folder)
|
|
pageOne.html _ _ _ _ pageTwo.html

Is there a way to achieve this purely with jQuery or by using Bootstrap ?

How can I retain focus on sub-menu items such as item 2 and main menu items whenever I access different pages?

Upvotes: 0

Views: 458

Answers (1)

Yasser Shaikh
Yasser Shaikh

Reputation: 47774

HTTP is a stateless protocol. Here in your case since the page is reloading, the browser cannot remember the selection (though there are ways which I wouldn't want to recommend like storing the selected menu in local storage or somewhere and later on page load read that value and use it), server though has the information. So while rendering the page and the menu you can pass this information to your accordion and render with the appropriate element selected.

Upvotes: 1

Related Questions