Search code examples
javascripthtmlglobal-variablespartial-page-refresh

Is it possible to create a variable, that doesn't change on refresh the page, in javascript?

After I ask this question:

I was thinking about this solution:

  • Create a boolean flag inside the javascript script and make it true:
    • true indicates refreshing the page using the browser.
    • false indicates refreshing the page using a button.
  • Inside onclick attribute of the button, I set flag to false and call window.location.reload() to refresh the page.
  • Inside onload attribute of <body> tag, I check the flag if it's true switch to Home tab else switch to Page1 tab where it contains the <div> tag I want to refresh its contents. After that, set flag to true.*

But unfortunately it doesn't work and flag is always true when it comes to onload attribute of <body> tag. Is it possible (somehow) to create a variable, that doesn't change on refresh the page, in javascript?

*My page consistes of many tabs, first one is Home (where it should be shown when refreshing the page using the browser) and second one is Page1 (where it contains the <div> tag I want to refresh its contents and where it should be shown when refreshing the page using the button)

Solution

  • The browser is stateless, which means that everything on the page is refreshed each time the page loads.

    There are a few ways to store persistant information that you can access between requests:

    • Store the data you want in a cookie and read it when the page loads
    • Pass data to the URL and read the current URL (including the data that you passed) when the page loads. For example: Redirect the browser to http://something.com/yourpage.html#flag=true if the user refreshed through the browser or redirect to http://something.com/yourpage.html#flag=false if the user clicked the button. On the onload of the page just read the current URL and see what the flag is.
    • Use a cookie to create a session and store data on the server (technically this is very similar to the first option except you just store a token on the client and pass it to the server to retrieve data that was stored there)