html event when get to page with back - javascript

I have a html page that have radio buttons that initially are all unset - this is by design.
The problem is if you move forward and then use the browser back button you could get to the page in a weird state, because the browsers reset some stuff, but not the radio buttons.
Is there event that I could handle to reset all I need when I get to the page with a back button?

Related

Keep scroll position in ADF page

I have a page with few forms in it and a submit button to save the records. If there is any errors then I m displaying the error messages programmatically in faces message .
But after clicking on the ok button on the af message, the page scrolls to the top and I have to scroll down again to click the button.
Is there any way to save the scroll position in ADF . I tried to call Java script
Window.scrollto () method
But for other methods it's working fine but not after clicking on the af message ok button.
Please let me know any way to scroll down to the bottom of the page.
markosca already gave the correct hints as a comment.
I'll clarify a bit on this for the sake of a complete answer:
If your buttons trigger an action, always a complete new site will be loaded.
Even if the "new" site is equal to the old one, it will seem as if the site has scrolled up.
If your buttons have an actionListener registered, this scrolling will also happen. Even if you put an addPartialTarget(...) inside that registered Java-method.
So, how to solve this? It's easy, just use an actionListener and the attribute partialSubmit="true" on the button or link.
Only than a partial submit will be executed instead of a full page reload.
And don't forget to either use addPartialTarget(...) in Java or the attribute partialTriggers="..." on the components which should update because of that partial submit.

How to focus on the trigger element which opens and modal and once the content is saved the whole page destroyed and rendered again

This is more of an architectural question, so in a webpage I have a edit button when allows me to edit a record. As soon as I press the edit button a modal opens up I change some of the records info and I hit save.
The focus returns to the (X) close button of the toast(save confirmation) for a second and even before the toast disappears focus returns to the browser since the save refreshes the page and the dom is destroyed and created again.
What we expect to do is once we hit the save button in the modal, focus should go to the toast (x) close button and wait till the confirmation dialog(toast) disappears and then return to the edit button again.
So there is 2 problems to be solved
How to set focus on the edit button(trigger) when the dom is destroyed and created again once we hit save button in the modal, coz there are a few buttons before that like new, view and then edit. how to specifically set focus on the trigger element?
How to create focus stack where we can specify that the focus should go to toast first and the n to the trigger even if the dom is destroyed and created again (is that possible)?
When I say "the dom is destroyed and created again" is it about replacing DOM content partially? Or the whole page is reloaded?
Just the header panel in which these trigger buttons (New, Edit, View) are destroyed and created again. So only partially the dom is destroyed and created again
A toast message is typically temporary and goes away on its own. It should be unobtrusive so that it can be easily ignored. If you have an X close button and you want to user to click on it (or hit ESC) to dismiss the toast message, then you really have a modal dialog instead of a toast message.
On sites that I've used that allow editing and saving, I've found that just a simple save message right on the page is sufficient. The save message can be an aria-live region so that the message is read for screen reader users. The save message usually goes away if I start editing other fields.
If you have to force focus to go back somewhere after a DOM is recreated, you'll have to save where you were (cookie) and then get the save point and just call the focus() method on it.

Stay on same tab after postback

I am using Samson O's very nice Easy Responsive Tabs to Accordion plugin on an ASP.NET page. On Tab 2 I have a Search button that when clicked executes some code in a code-behind and returns the search results to the page. Everything works except that the page goes back to the first tab when it's finished running the code in the code-behind. I want it to stay on Tab 2. How can I achieve this?
I have tried calling a JavaScript function to simulate the click of Tab 2 ($('#mycharities').click();) from the OnClientClick event of the Search button and also as the last thing on the Search button click event in the code-behind. Both options run the JavaScript but the page still goes back to the first tab once finished.
Answer to your question lies in the script for this plugin :
//Active correct tab
$($respTabs.find('.resp-tab-item.' + options.tabidentify)[tabNum]).addClass('resp-tab- active').css({
'background-color': options.activetab_bg,
'border-color': options.active_border_color
});
If you notice it takes [tabNum] to set the active tab. So you need to figure out the last selected tab num and in your custom javascript function that you need to set the appropiate css class to that tab. Then u will have it selected after the postback.
Best yet try to submit using AJax. It easy and you can avoid hassles.

Post Back a Disabled form inside IFrame from Parent Page

I have a page that contains a check box collection, an associated label on the left side, and an Iframe division on the right side.
When the check box division (including label) is clicked, the corresponding page is loaded in Iframe. Also, when clicking on another text check box didvision the page values in the current page should be saved and new page should be loaded in IFrame.
I accomplish this by calling the Javascript function of the Iframe page from parent page which, in turn, does a postback and triggers the save loic inide the event (For eg: I have a button inside each page which is hidden but has an event).
My problem is that when the check box is unchecked, the form displayed on the IFrame is cleared and disabled. So, when I click on some other division the postback of the current disabled form is executed and, since the entire form is disabled, there is no postbacking happening.
How could I trigger Postback for the disabled form or save the data another way?
Note: I even tried enabling the page before calling postback, but it still isn't triggering.
I would try to replace your iframes structure with dynamic sections controlled by Ajax. If this isn't feasible, rethink your disabling of the form. If the reason you're doing this is to prevent posting values twice, maybe instead of disabling the form, hide the button instead.

Javascript Back Button in Modal - Stop it from closing the modal

How do I get the "back" button seen in my demo to NOT close the modal window?
If this can't be prevented, then at least provide them with a confirmation box alerting them the window is trying to close and ask them if they want to continue.
I'm using a javascript back button link and forward button link to control the user's history inside a modal/lightbox window.
Here's a demo of what is happening... When you begin, the second page will have a link to the modal window, so click that, then click the "back" button in the window as it will take you BACK to the start page. That's the issue I'm having as I don't want this to happen.
http://www.apus.edu/_test/evan/modal/start.htm
Back Button
Foward Button
If you can see where they are in the page (ie: the start page having a static back / forward button ) why not just make the back button a javascript:void(0)? If you aren't going to have a defined front location, use server side to store their start place, and once they have reached it, disable the back option.

Categories