Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden using our free interactive tool and use it to determine the right price for your IT services. Start calculating Now!
Disabling Back Button on Browser
Hi Experts,
I have a web application that takes a lot of data-entry... Often, when an user doesn't have focus on a field and clicks Backspace, their data is wiped.
Is it possible to disable Back using JS? If no, can I disable it for individual browser (FireFox, Chrome, Safari) for a particular subdomain?
Of course, I prefer JS.
Thank you
I have a web application that takes a lot of data-entry... Often, when an user doesn't have focus on a field and clicks Backspace, their data is wiped.
Is it possible to disable Back using JS? If no, can I disable it for individual browser (FireFox, Chrome, Safari) for a particular subdomain?
Of course, I prefer JS.
Thank you
Do more with
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
I don't think you can do that. This has been asked before here. Taking 'control' of a user's browser is considered a breach of security.
When I have had to do a long form, I have broken it into smaller pages and used PHP sessions and MySQL to track what they have entered so it doesn't get lost.
When I have had to do a long form, I have broken it into smaller pages and used PHP sessions and MySQL to track what they have entered so it doesn't get lost.
There is still no reason to block the back button. You can't control that. However, you can control the user input gui.
If you have a long form, convert to a wizard where there is just a small amount of data and keep saving with each "next" button pressed. Or you can use your javascript to send an ajax request to save after each field looses focus.
When the user first steps into the form, create some type of token that is saved as session. Then store that session token in your db and insert a new row. Then each time a user enters a field and moves out of the field, update that row of data using the session token as they key. Now if they happen use the back button and save again, you already know the token and are just updating those fields.
It's all in your process. But trying to do anything that prevents a user from using their browser functions will just be a pain point for everybody.
If you have a long form, convert to a wizard where there is just a small amount of data and keep saving with each "next" button pressed. Or you can use your javascript to send an ajax request to save after each field looses focus.
When the user first steps into the form, create some type of token that is saved as session. Then store that session token in your db and insert a new row. Then each time a user enters a field and moves out of the field, update that row of data using the session token as they key. Now if they happen use the back button and save again, you already know the token and are just updating those fields.
It's all in your process. But trying to do anything that prevents a user from using their browser functions will just be a pain point for everybody.
I have never seen anything that could disable the back button. Not anywhere. There is a function in JavaScript called 'onbeforeunload' which usually just pisses people off because it is used to keep people from leaving a web page. I can't give you sample code for it but it is fairly well documented.
http://www.w3schools.com/tags/ev_onbeforeunload.asp
http://www.w3schools.com/tags/ev_onbeforeunload.asp
OK, can we look at this differently...
Leave the Back button as it is, but somehow "Listen" for the Backspace key via ASCII #. Then when pressed, if within a textbox or textarea, normal behavior, otherwise don't do nothing?
Leave the Back button as it is, but somehow "Listen" for the Backspace key via ASCII #. Then when pressed, if within a textbox or textarea, normal behavior, otherwise don't do nothing?
Huh?? The Backspace key is used for editing and has nothing to do with the Back button. I just moved the focus out of this text box and pressed the Backspace key 3 times. Nothing happened. Firefox 42.0. What browser are you using?
Maybe I should also note that there are other ways to go 'Back'. I think you need to focus on how to get your users to go forward successfully.
The client won't approve of the wizard-style input, they need to view multiple things...
Backspace is ASCII #8, http://www.theasciicode.com.ar/ascii-control-characters/backspace-ascii-code-8.html
I know there is a way (keypress or keydown) event, the fires before the onchange? can I use that somehow?
Backspace is ASCII #8, http://www.theasciicode.com.ar/ascii-control-characters/backspace-ascii-code-8.html
I know there is a way (keypress or keydown) event, the fires before the onchange? can I use that somehow?
Backspace key has nothing to do with the browser Back function. There, I said it again. From this side of the screen, you're not making any sense. Can you give us a simple example of the problem you're having?
When pressing backspace on most browsers, including FF 42.0, it does go back.
You said you could not replicate... click on an empty space on this page (not on any field, not on any link), then press backspace. If you don't go back, maybe you have disassociated backspace with back?
You said you could not replicate... click on an empty space on this page (not on any field, not on any link), then press backspace. If you don't go back, maybe you have disassociated backspace with back?
I did and it doesn't do that here in Firefox 42. I did it in Chrome and it does go Back. I've never done that before.
Oh, never mind. Since this page opened in a new Tab, there isn't any Back page to go to. Hmm... maybe you can use that to your advantage. ?? Open the problem page in a new tab or window and there isn't any Back page to go to.
Oh, never mind. Since this page opened in a new Tab, there isn't any Back page to go to. Hmm... maybe you can use that to your advantage. ?? Open the problem page in a new tab or window and there isn't any Back page to go to.
As I don't know JQUERY, Can you explain the code below that I got from stackoverflow.com/question
How do I incorporate it?
$(document).on("keydown", function (e) {
if (e.which === 8 && !$(e.target).is("input:not([readonly]):not([type=radio]):not([type=checkbox]), textarea, [contentEditable], [contentEditable=true]")) {
e.preventDefault();
}
});
How do I incorporate it?
First you have to be loading jQuery. That code is supposed to identify the Backspace keycode (8) and if it the focus in not in one of the items in the list, prevent the default action of going Back.
To use jQuery you need to add jQUery to your page.
This can be done using a so-called CDN (content delivery network) or you can save the js file on your server.
You can serve the https or http version or if you do not load from local disk, remove the protocol liek this:
In the example below I removed contenteditable since you likely do not need it.
The structure of your page will be
This can be done using a so-called CDN (content delivery network) or you can save the js file on your server.
You can serve the https or http version or if you do not load from local disk, remove the protocol liek this:
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
In the example below I removed contenteditable since you likely do not need it.
The structure of your page will be
<!DOCTYPE html>
<html>
<head>
<meta charset=“utf-8”>
<title>Page title</title>
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script>
$(document).on("keydown", function (e) { // any key
if (e.which === 8 && // if backspace in an input field or textarea, prevent the default backspace action
!$(e.target).is("input:not([readonly]):not([type=radio]):not([type=checkbox]), textarea")) {
e.preventDefault();
}
});
</script>
</head>
<body>
your page
</body>
</html>
Premium Content
You need an Expert Office subscription to comment.Start Free Trial