HI i have a ExtJS code on the front end. the drop downs on this page are loaded dynamically thru web-service call to 3rd party service. i have navigated from this page to the results page.
Now in results page i have a button which allows the user to go back to previous page. but all the data in the drop down should be retained.
i tried window.history.go(-1) and history.back()
Guys please help me.
If the navigation page is under different url than result page then it's not possible. You probably should save state of that menu for example in cookies, or in session on server so you could restore that state for each client. Also HTML5 client-side storage is an option.
Another possibility is to change the way result page loads, so you won't need reload page to go back (for example use AJAX).
I am using now extjs4 mvc design. We have a single html page, multiple views, a model and a controller.
On navigating to a new view, you need to hide the previous panels and when going back show the previous panel. This solved my problem of navigating and retaining view.
As above this is not suitable for mvc if you use it for multiple apps and older design where we use onReady().
Related
I use Angular 2 (v2.4.4) and by using routerLink I navigate between the components.
This works fine, but if I load the very save component with the very same snapshot parameter (active.snapshot.params) the page won't get loaded again. So, for example if I am on /page/56 and I click on a link here which points to /page/56, the very same link (from a menu or something), the component won't reload. (And things might change in the database since the last load, so the page needs to be reloaded.)
I bypassed it by pointing to /jump/page/56 and the Page 404 controller redirects to /page/56.
This also works fine, but if I navigate back in the browser from /page/56, it will get to /jump/page/56 which directs to /page/56 by the Page 404 controller. So basically I cannot navigate back.
As much as I know, I cannot delete browser history by the HTML5 history API, but how could I go back to the page, which was right before /page/56, just by simply clicking on the back button of the browser?
The solution might be a simple JavaScript trick independent from Angular 2, as it does not actually load a new page just loads a different component and changes the URL. (Also because of this I should not use location.reload() because it will reload Angular 2 and all the depending JS, etc.)
Thank you for your solutions in advance!
you can use skipLocationChange Like :
this.router.navigate(['/jump/page/12'],{skipLocationChange:true});
Seems the only way is to create your own dicrective inherited from [routerLink] to control click handler or just add click handler to current element with managing refresh by yourself.
<a (click)="navigate(['/jump/page/56'])">Navigate</a>
where
navigate(route) {
this.router.navigate(route, {replaceUrl: true});
}
I have made a basic HTML file by using HTML, CSS and javascript. Based on the user's input and specific actions, I've run methods to create elements(which alter the page). And when the user wishes to go to another page via the link in the page, I want to save the changes that are made in the page.
Note: I am using Google Chrome on Windows XP
And the method execcommand() does not work on Chrome
Any help is appreciated
Thanks in advance
Then you can do two things,
first:
Detect when the user changes the page, at that time script for coping the page like:
var your_var = $(document).html();
$(document).load("new-page.html");
and then navigate a back button detection, when the user comes back to the first page just place your_var like:
$(document).html(your_var);
This is only applicable when your page navigation is done using only jQuery/ Ajax.
Second:
If you want to save state with server side scripting as well then use
javaScript.history();
this will give you the same page you left before with state.
We have designed the application with tabbed pages layout.
Tabbed Page Style
the tabs are page and are created on click of menu, these are and added in parent container as child DOM element,it is a new form which has input elements,we could have many tabbed pages at a time. my application is in Spring MVC ,PostgresSQL ,Jquery.
What happens when refreshed, lost all the added dynamic new tabs (tabs are pages and we lost the current state).
I could share the reference code if required.
Please suggest how could I manage the state of application.
Window reload/refresh is a pure browser event that ends the execution of the page, you can't really have script continuity after it.
One option is to attach an alert to window.onbeforeunload informing the user that the content will be lost if they reload - this will work with closing the window and refreshing it.
If, however, you need to be able to reload (eg, to load fresh data in the tabs) while preserving tabs, you can use window.onbeforeunload to prompt the user whether they want to save the data/layout before closing, and if so, execute an AJAX call to the server, where you save the tabs (associating it with the session). This would mean that on loading the page you need to first check if there is tab data associated with the session, and load from there.
Other option - and this would be my preference - is to use window.localStorage to save the data on user's disk, and on page load check if there is data in localStorage. It has pretty wide browser support at this point, and there are good libraries that make using it a breeze. I have used store.js and can vouch for its ease and reliability.
I'm creating a single page application with KnockoutJS. It has 2 sections, home and history.
At the homepage there is an button and with the onclick you navigate to the historical section.
function initialize() {
model = new MonitoringViewModel();
pager.extendWithPage(model);
ko.applyBindings(model);
pager.start('home');
}
When the button is clicked i'm calling a method in wich pager.start('history'); is called. It works correct, but at the historical section when i refresh the page i'm navigating back to the home-page..
How can i make sure that when the page refreshes, the page doesn't goes back to the homepage?
I have faced this kind of situation before.My recomendation for this kind of app, use Angularjs for this. It can easily handle page routing and this kid of historical problems.
If you can not change the technology now, you need to handle this by using cookies.
I am working on a existing MVC4 project where we use to switch between screens using jQuery AJAX html() function. Ideally, the URL needs to be changed on every action so that the user can use the Back button (browser) to go back, but we are not changing the URL.
Ex:
http://mywebsite/bank/verify - link used to show login screen, lists the accounts and then their transactions step by step. When the user refreshes the page, the actions starts from login again which I want to avoid.
Thanks in advance.