There are two open tabs pageA and pageB, in pageB there is a selectOneChoice whose data is based on pageA, when I delete one piece of data on pageA, then go back to pageB, the deleted data is still in selectOneChoice list.
Is there any way to refresh selectOneChoice data when going back to pageB?
Related
I'm building a react js website that has three pages of inputs
the last page should have all the data entered in the previous pages
it will be a summary of the data
for the first three pages i have been using use state and handle submit in order to show the data in the console log
now I want to gather all the data on one page and it should be displayed on the last page
not in the console log
what technique should I be using?
option 1 :
in each page, save your data to localstorage and in the last page get your data from local storage (then delete it from local storage).
option 2:
pass your data as props; pass data from first page to second page then pass data of the first page and second page to third page....
We have a web app composed of several pages containing links of data retrieved from database. Upon clicking one link[data], the user should be directed to another page. For navigation between pages, we have used breadcrumb. The breadcrumb is stored in redux store. Currently, when the user tries to ctrl+click or open link in new tab, we managed to use single store across multiple tabs. Hence, if the user opens 3 separate links [data] in new tabs, the updates made on the breadcrumb affect previously opened tabs when these tabs/pages are refreshed. For example:
In homepage, I have these links:
Data_1
Data_2
Data_3
Current breadcrumb in the homepage is like this:
HomePage/
Once the user opens Data_1 in new tab, the expected breadcrumb in the new tab is:
HomePage/Data_1/
Similarly, if the user tries to open Data_2 and Data_3, in new tabs, the breadcrumbs should appear as follows for tab 1 and tab 2, respectively:
HomePage/Data_2/
HomePage/Data_3/
In the current implementation, I managed to update the state of breadcrumb whenever new links are opened such that breadcrumb[0] would be equivalent to HomePage while breadcrumb[1] was initially Data_1, then became Data_2, and lastly Data_3. Hence, the last value of breadcrumb[1] is Data_3 since that's the last opened link. My problem is that whenever the user refreshes previously opened tabs/pages corresponding to Data_1 and Data_2, since they are all using a single store and breadcrumb[1] has been changed to Data_3, the breadcrumbs in Data_1 and Data_2 pages also become Data_3.
In this case, I can just think of using multiple stores since I perceive that it could be the only solution given my use case. Meanwhile, I can't find any sufficient documentation online regarding using multiple stores in redux. Maybe I can pass the store to the next page in params...? something like that
Can someone please help. Thanks in advance.
To emulate per-tab same site persistency, I would, right before the page is about to be refreshed (window.beforeunload or similar)
1 - Write to localStorage about my breadcrumb
2 - Refresh
3 - Read from localStorage about my breadcrumb to initialize myself properly (so the data here SHOULD be mine because i just wrote it)
4 - remove breadcrumb information from localStorage (to prevent other tabs from reading it)
Now, you still have the case where the user just closes the tab, so you would have stale data about the breadcrumb in your localStorage. You can add a little expiration mechanism (you might consider that data in the localStorage older than 10 seconds is stale and just pretend it isn't here and delete it at step 3.) Cookies would work pretty much the same, with a built-in expiration mechanism.
I'm working on a site where the user can navigate by using a menu system. I have my save function firing on the componentWillUnmount. One page in particular allows a user to set a field where they can define a number. The next page generates a bunch of text fields corresponding to that number. The problem is, the second page loads before the first page has finished saving. So if page 1 initially has a value of 1 and I change it to 2, the second page will display 1 text field initially, forcing me to refresh the page to see the correct data.
Any ideas or help would be appreciated!
React router has very cool feature: if you have a list of items (Instagram for example) and if you click on one item, content opens in modal/overlay but if you copy-paste the link to new tab/window or share the link with a friend for example, it opens in its own page.
I would love to use this feature but I need to find a custom solution..
My posts are very data heavy
I've split posts data into 2 tables in database
1st is very lightweight containing essential data: 4-5 columns
2nd table is very heave, ~30 columns
When user uses search filter, list updates only with data from 1st table
If user clicks on post, it will open in a modal/overlay
I will recycle the data I already have (from 1st table) and also get rest of the data from 2nd table
However, when user shares the link or opens it in new tab/page, data from 1st table is not present. I would need to integrate a conditional logic:
If post opens in list view (modal/overlay), only get additinal 2nd table data
If it's opened in a new tab/window in its own page, get all the data, 1st table included
How could I integrate this with React router? Has anyone already tried it? This would also allow to use different layout/components when user opens item in page view. Is there a way to check it?
Or is there a flaw in my logic? I imagine list would update very fast because it doesn't require huge amount of data and also would modal/overlay because it recycles some of the data.
I read all the docs, also searched online - didn't find anything.
Modals in react router are great. I've used the pinterest example and adapted it to my own needs.
Ensure you do your check on state.modal===true in a master layout component to give you the modal styling.
you'll need to check if table 1 stuff is present in your state and dispatch an action to trigger the async call in componentDidMount. You should be fetching table 2 in all scenarios.
I am new to angular and was wondering if I could somehow change states (after clicking on link from a list of search results) and load a new view, hide the old one (including header !), but not unload it/not have to request JSON data again if I got back to the search results for products view from the product details view.
Well, this will be a really short answer.
Take a look at this:
$templateCache You can play around with it so you won't need to reload pages when going back and forth.