0

I have a classic navbar menu with links and sublinks. One menu link is called "houses" and it has subitems called "home1", "home2", "home3". On the page "houses" there is an html container with tabs and each tab opens a section that contains info on "home1", "home2" and "home3". Everything works well.

My question is, is it possible to do the following: when i click on any sublink "home1/2/3" from ANOTHER page other than the "houses" page, the "houses" page should open AND the sublink that i clicked opens the respective tab?

I tried a solution with Vanilla JS but as expected it only works when i am on the "houses" page. I understand WHY it is happening but i have no idea how to achieve this (besides asynchronous execution of some sort?).

My code:

const menuitem = document.querySelectorAll('#menu-item-27 ul li [data-text]'); //data-text is the sublink - ("home1", "home2", "home3")
    for(let item of menuitem) {
        item.onclick = function() {
            window.onload = function WindowLoad(event) {
                document.querySelector('[data-tab="2"]').click(); 
                /* data-tab=1, data-tab=2, data-tab=3 is the tab element that opens the info on one of the "home1/2/3" divs 
                I'm using just data-tab=2 to test the click, don't worry about that part
                */
            }
        }
    }
Uriel
  • 144
  • 10
  • One approach to doing this is to put something in the url, either via a query parameter or a hash value, that the secondary page will then use to know which tab to open on load. – Taplar Aug 21 '20 at 21:27
  • i thought of this but how would you do that given the code i used above? – Uriel Aug 21 '20 at 21:28
  • You wouldn't do it on the page you come from. You do it on the page you arrive on. That's why you have the url part. To convey between pages what should happen. – Taplar Aug 21 '20 at 21:29
  • ok. can you show some code on how to achieve this? – Uriel Aug 21 '20 at 21:30

1 Answers1

2

There are many solutions to solve this question. For example, you can create a cookie to store information that can be useful for the next page. Use cookies

You can add a parameter to your URL and when your page is loaded you can get the information and make some actions depending on the parameter. Add parameter

Or, you can use the localstorage.

The logic remains the same. The goal is to store information that will be persistent for at least one request in order to take action on the next page load.

S.LT
  • 378
  • 1
  • 8