Skip to content Skip to sidebar Skip to footer

Make Button Disappear Permanently

I have a situation, when the user clicks a button in page A the button will disappear and go to page B. and when the user goes back to page A, the button will still disappear. Is i

Solution 1:

When the button is clicked, you can set a value in sessionStorage. Also, on page load, check to see whether that value exists in sessionStorage, and if it does, hide the button. For example:

<ahref="foo">foo</a>

JS:

const a = document.querySelector('a');
if (sessionStorage.clickedA) a.style.display = 'none';
a.addEventListener('click', () => {
  sessionStorage.clickedA = 'clicked';
});

https://jsfiddle.net/qfsuLyc3/

I don't think cookies are a good idea because it's information that seems to be only relevant for the client, not the server. (cookies will be sent to the server)

sessionStorage persists over a page session. If you want the button to be hidden even after the browser is reopened, use localStorage instead, which uses the file system, rather than memory, and is persistent.

Solution 2:

If you want this on a temporary basis, you can use GET method. You can pass an additional value in the URL from page two to page one, and check if the value is present or not.

Example:

<ahref="pageOne.php?movingback=true">Go To Page One</a>

On the first page, check the presence of the movingback (I am using php to do the same)

<?phpif(!isset($_GET['movingback']) || !$_GET['movingback']=='true'){
  echo"<a href='pagetwo.php'>Go To Page Two</a>"
}

Post a Comment for "Make Button Disappear Permanently"