disable manual page refresh and allow programmatically only - javascript

I'm want to disable the manual refresh but still allow it throw code only.
the page is responsive so the mobile refresh(drag down) is also need to be disabled.
I've tried already to preventDefault with:
window.onbeforeunload
window.onunload
and jquery:
$(window).unload

You cannot disable a refresh - you would enforce the user to stay on your page.
A common way (like jsfiddle and others) that is used when there's unsaved state, is to trigger a popup that asks the user if the page should really be left.
This is useful if some input hasn't been saved - having just some content that is refreshed over time it may be more annoying for the users.
A possible solution is found here

Related

Display a customized confirm box in angularjs when user leaves a page

My requirement is to display a customized confirm box when the user leaves a page without saving form data.
I used the window.onbeforeunload event it is displaying google chrome related predefined confirm box. When the user changes any form and trying to reload, tab close or route change I want to display a $mdDialog.confirm and asking user to leave the page or stay on the same page. How do I make one?
For security reasons, this cannot be done. You can find more details in the MDN page on the beforeunload event.
In the past, you could return a custom string that was displayed to the user, but these days even that is ignore. The best you can do is instruct the page to show the standard dialog that you already have. (And in some browsers and some scenarios, even that instruction may be ignored.)
An alternative is to include a button in the page for leaving the form. Although that still does not prevent users from navigating away from the page directly, if it is sufficiently visible, in many cases users are more likely to click that than navigating directly. It also serves as a passive reminder that the form needs explicit saving or cancelling (depending on your specific details, of course).

Button not enabling on refresh

User clicks and button gets disabled.
User reloads page.
Button is still disabled.
I want it to be enabled.
I have tried anything from onkeypress f5 to onbeforeunload and nothing works.
This is an issue I had the misfortune of encountering before, since most browsers rely more and more on local cache to improve page loading. While in chrome usually another page refresh fix it, Firefox is more stubborn.
I solved it by running a function using body onload event. This function detects those incorrectly disabled elements and re-enables them.
To avoid errors there must be a check to indicate weather this page has the elements to check in the first place.

Alternatives to disabling / disable back button in firefox and IE

Our application forbids going back for several reasons.
Basically because that's just how our application works (JSF with facelets as GUI)
You always have to enter on the welcome site, once you chose an application-flow you can only leave / abort when you tell the application (e.g. press a button). If you just browse away e.g. enter "example.com" in the address bar the state of your flow gets saved and once you relogin, you can resume the work. Going back is only possible when it was specifically designed like this with a 'back' submit - button.
Of course users keep pressing the 'back' button (i would do so as well) and they keep getting 'error: session out of synch'. This is a learning process and a couple years ago we just disabled the back-button to make things clear. Sadly this is no longer supported.
So instead of teaching the user the hard way and forcing him to relogin, are there some good alternatives I'm missing?
i found this link which should offer 3 methods to disable the back button - but in reality it just further confirms the fact that it is impossible to do it in a semi-nice way.
when the user tries to go to a previous page you can redirect him to the page he should be at in other words catch the "out of sync" and redirect him
You might find a workable solution here How do I insert an entry into browsing history via JavaScript
by inserting an extra step into the browser's history (perhaps a link to the current page with query string parameters that result in a nice big red box message to the user), or you could try attaching an event handler to the OnBeforeUnload event so the user gets a confirmation dialog when trying to leave the page (you'd want to remove the handler when the submit button was clicked).

JavaScript - detect browser stop button click

I have a form that disables submit button, when it is clicked.
But what if the user clicks browser "Stop" button.
Then he will not be able to resubmit the form.
Is there any way to handle such cases, possibly detecting Stop button press?
What is the reason for disabling the submit button?
You are trying to avoid double-clicks? -> you can disable the submit button for only a brief period of time, re-enabling it again on a timeout.
You are trying to avoid impatient reload-clicking? -> the same, but with a longer inactivity period.
You are trying to stop a form being submitted twice causing duplicate actions to occur? -> you can't fight this just with button disabling, as going back/forward will cause the page to be reloaded, likely keeping old form content but not the disabledness state, unless short-circuited by bfcache. In this case you must create a one-use token or new item ID that cannot be used more than once, and put it in a hidden field in the form. The server can check for it and disallow duplicates.
possibly detecting Stop button press?
Avoid onstop, it's not really reliable. Apart from browser support issues, it can't catch all possible combinations of navigation and stop/reload/etc. You'll never know how far the server script got, whether it performed an action.
Your best bet would be to detect the submit button on the server, so it can only be submitted once. This way, no matter what happens (firebug etc), the form is only submitted once. There is an OnStop() event, but it is IE only, and I would not recommend using it.
document.onstop
You can find documentation for it here:
http://www.codeguru.com/forum/archive/index.php/t-437967.html
https://developer.mozilla.org/en/DOM_Client_Object_Cross-Reference/document

JavaScript problem toolbar=no

I have a simple logon page. When the user is validated, the window navigates to a new page. The javascript is window.open('http://www.google.com',"mytest",'toolbar=no'); My expectation is that when it navigates away from our logon page and opens the google site that the back button would be disabled. But it's not. Does anyone have any idea why?
It depends on your browser. Ultimately, all you can do with javascript's window.open() is tell the browser what you'd like it to do, but it's not obligated to do it. Browsers can and do ignore some directives based on user preferences.
I believe the option your looking for is 'location=no', as that hides the address bar and therefore the back button too. The toolbar is things like favorites/etc.
This is bad practice - what happens if the user has javascript disabled? If the browser prevents the js from removing the toolbar of the main window?
Instead, amend the logon page to detect whether the user is logged in before showing the login form. If logged in, show a message saying so instead of the form - that way, a user clicking back won't be a problem.
I find it very annoying when a website messes around with my browser window, and generally don't come back.
This is what worked for me. Instead of disabling the back key. I listen for on unload event. I then write the following in javascript:
window.onbeforeunload = function () { return "You should not press the back button while in this application. If you continue, your work will not be saved and you will need to log back in."}
Java Script pops a dialogue box with OK and Cancel options. If the user clicks cancel. The application stays right where they are. The script is embedded within the tags. For me this is the ideal solution. I found this at
http://www.hunlock.com/blogs/Mastering_The_Back_Button_With_Javascript

Categories