Javascript - Go Back Page List - javascript

Current working code to go back one page:
onclick="location.href=document.referrer; return false;
This code allows me to go back by one page only. Are there any code snippets that would allow to go back multiple pages similar to a browser's back button?
I understand there is a go() method to use with window.history.go(-i) but that doesn't solve the need. I am hoping to show a list of pages visited for a user to click on the desired page. This is similar functionality to a browser's back button.
In essence, trying to go back sequentially instead of jumping back x number of pages.
Thanks in advance for all of your inputs.

Related

Navigating back to Search Page with same state (JavaScript)

How do I, using JavaScript, retain the state of the search page, when a user clicks into a search result, but then goes back to the main search page.
e.g.
HTML:
https://startech-enterprises.github.io/docs/guides/data-analytics/data-analytics.html
There are 5 elements that determine what is shown on the page:
What tags are clicked in the three filter menus, on the side
What search term is typed into the search menu bar, at the top
The pagination page that is selected, at the bottom
Problem is that whenever I go into the search result, and navigate back to the main search page, the search page resets itself, so I have to re-enter the search criteria again - which can be quite annoying.
If I click 'back' in the browser, the search page state is retained, but the search script stops working. Also, using the 'browser' back button only goes back one 'link' - so if the user clicks on several links in any page (returned from the search), they have to press the 'back' button many times, to get back to the main search page - which again isn't ideal.
Any ideas on how to solve this? Would seem like a fairly common problem?
The site is purely static, (generated using Markdown and Jekyll). Site interactivity is set with Vanilla JavaScript, and SASS/SCSS.
Pls do help!
Many thanks in advance.
Sachin
UPDATE: This has now been solved based on the answers given below
You can simply do it by saving the data in users device . You can do it by using cookies or by localStorage. I prefer localStorage because users can deny cookies easily.
Like this-
localStorage.setItem("tags",tagItemsInAnArray);
And laterlocalStorage.getItem("tags");
You can use localStorage to keep the search filter data. The concept is to keep all filter data in an array and keep that array in the localStorage of the browser before any redirection. Here is an official documentation with implementation of localStorage.
Here is a demo:
//before redirection
let filterData = [];
localStorage.setItem("searchFilter", JSON.stringify(filterData));
//after page-load
let cachedFilterData= JSON.parse(localStorage.getItem("searchFilter"));
if(cachedFilterData.length>0){
//cache data exist
}
//when you need to delete cache
localStorage.removeItem("searchFilter");

How to create a page location in browser using javascript/jQuery?

I have a setup where I display a list of buttons and clicking on the buttons triggers a function that contacts a firebase database and gets the contents of a 'slide' that is to be shown to the user. The function then clears the content of the page and then creates elements from the data acquired from the database.
Now obviously, when I press back browser button once I've replaced the content, it won't take me back to the previous content. But I believe that my user's experience will be much better if it actually took them back to the list of buttons. I have two faint ideas on how to go about solving this problem but I'm lacking in specific details of how I can go about it.
Possible Solution 1:
Some way to dynamically create a new page using javascript and then serve it to the user.
Possible Solution 2:
Some way to simulate that the page has changed location. Maybe using anchoring links.
Let me know if you have any other solutions in mind or if you know how I should go about implementing these. Your help will be much appreciated. :D

Add a ExtendScript to a button in Indesign

Well the title pretty much explains the problem.
I have a InDesign document containing buttons.
One of the buttons should go back to the page the user comes from (previous page).
So I want to create a var containing the value of the pagenumber on the button on the previous page like this:
var prevPage = this.pageNum;
Then on the button that should get the user back to where he came from add this:
this.pageNum = prevPage;
This works if I do this after the PDF is created. But since this is a time consuming hassle to do every time the client makes corrections I would like to do it in InDesign.
I know I can add an action to the button containing a menu-action "go to previous page". This literally goes through the Acrobat menu and takes you to the previous page.
The problem is that the Acrobat app doesn't have that menu. So the action can't find the menu items and won't work.
I would like to add a script to the button... but seriously wondering if this is possible. I couldn't even find a plugin that does this.
Hope the stack-brothers have a solution.
Use the script below for the button action. It to the previous view on the view stack, which is equivalent to clicking the Previous View button on the Acrobat toolbar.
app.goBack();

I need users to proceed to the next page on mouseover in javascript with turn.js

I'm having a problem with the turn.js api.
Rather than using this for a book, I'm trying to use it for an ad I'm developing. Basically, I want to have the first page immediately 'uncover' the second page when the user hovers over the page, but can pull from the corner on page 2 (as normal) to go back to the first.
I'm thinking that I could set a function of onmouseover to mousedown or something like that. Or maybe something totally different.
Any help would be appreciated. Thanks.

browser back button go back follow a custom url list?

I have seen history.js, it seems just work on current page:
such as:
www.mysite.com
www.mysite.com/?state=1
www.mysite.com/?state=2
www.mysite.com/?state=3
www.mysite.com/?state=4
www.mysite.com/?state=3
It can make back button back follow state from large to small only on the same page.
What I want is:
www.mysite.com/center/?state=1
www.mysite.com/product-list/?state=2
www.mysite.com/product-detail-manage-form/?state=3
center can not return to product-list, and product-list can not return to product-detail-manage-form.
Because a user can edit or delete a product at product-detail-manage-form page, and server will redirect he to product-list page after form submit.
I don't want he return to product-detail-manage-form by clicking back button on product-list page.
Is there any easy way to achieve my purpose?
Try using javascript to manipulate the browser history: https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Manipulating_the_browser_history
This way you can control the history stack and which pages the users can get to using the back button

Categories