I was trying to understand how we can maintain the previous data when jump to another URL and come back again.
I have a single page application, let's say page1, where I have a search field and search result. There are come external links in the search data and if user clicks to that links, URL changes and user goes to different page. How can I maintain the same result data when the user wants to come back to the previous result page by hitting browser's back button?
Make sure all you need for a page to be displayed in a given state is part of its URL. Let's take your example:
Search page. Initially empty. URL = /cars
You fill the search form and press the search button. This navigates to URL /cars?color=blue&year=2015. Going to this URL changes the route, and the route searches the cars and displays them in the page.
You click on a car. This navigates to URL /cars/12345. Going to this URL changes the route, and the route loads the car 12345 and displays it in the page.
You press the back button. This navigates back to URL `/cars?color=blue&year=2015. Going to this URL changes the route, and the route searches the cars and display them in the page, again.
In short, your app should work the same way as if it was not a single-page app, and if the server used the URL to generate a HTML page dynamically.
Related
I'm wondering if it is possible to store multiple browser histories, one for each section of the page.
Let's say I have the following routes: /home, /profile. And inside /profile I can go to /profile/edit.
So if I navigate to /home, then /profile, then to /profile/edit and then I press the back button (or navigate(-1)), it works fine and returns me to /profile.
PROBLEM:
If I navigate to /home, then /profile, then /profile/edit, then /home, then /profile/edit again and hit the back button it will send me to /home, as it is the last route on the history. However the desired functionality would be that it returns me to /profile, as it is the last route on the profile-history.
In this way, I would like to have independent histories for home and profile. Any possible solution?
For example i have a page /profile on there, the user isshowed his profile picture. When the respected user clicks on it, it changes to /profile/avatar. But, i dont want to change the page but show a component which otherwise will not be shown in /profile. Think of it as when you click on another's avatar in twitter, it changes to /#elonmusk/pfp a modal shows the image but it doesnt unmount the previous page
How can i implement that?
So I'm using most recent react-router and i have two pages. On the first one I select id and after pressing the button I get redirected to '/user/:id' endpoint. How can I store the state of the previous page. For example I press back button in my browser and I want to get back to the page with the user id selected in the form. Can I do it without using redux? Is there something for that inside react router?
I have a question that suppose, I have an Admin Dashboard page, on which I have given a list of users. clicking upon a particular user the details of corresponding user is shown on a different page (say on userDetails.jsp). Now I have a back button on userDetails page, Clicking of which I need to redirect admin to the last visited page that is Admin Dashboard page, I have one solution that I can "Reload" the previos page on clicking back button, but then I feel that there is the overhead of calling a server side API, retrieving all the data, Again redraw the whole admin dashboard page even when there is no change made in the userDetails[because it is read only page, modification is not allowed there]. Is there anyway that I can make user of cache or anything else so that I will not need to go to the server to fetch all the data again. I am using spring MVC, angularjs, Thank you.
On your button's click event add the following code:
$window.history.back();
make sure to use $window rather than window since you're using AngularJS
I am using angularjs and ui-router. I have a page where i search certain content and show/hide some sections. I want to add history to browser, so that when user clicks on back. He can go to previous page where he was. How do i handle this requirement.