I have an asp.net 4 site that I am using javascript's confirm() method before a user deletes an object from the database as a client based confirmation. With IE6-10, Firefox, Chrome, and Safari this works well. I click on cancel and it stops the page loading. However I been having problems using this on a usercontrol with IE11.
The usercontrol loads a datagrid which has an link button that gets the server to call a delete stored procedure.
With IE11, the Confirm popup opens, but if I click the cancel button or x on the window does not stop the page posting and calling the delete command in the server. I tried everything I can think off, but it just always passes and reads the page as valid.
In the code behind of the ItemDataBound we have this...
DeleteButton.CommandArgument = ac.ID.ToString(); //set the id so we know what to delete
DeleteButton.Attributes.Add("onclick", "Sure(event)");
This attaches the javascript to the image button.
Then in the file that contains the javascript we have the following code...
function Sure(evt){
var ans = confirm("Are you sure you want to delete? \n\nPress OK to continue or Cancel to stop.");
if(!ans){
var e = (window.event)? window.event:evt;
e.returnValue = false;
return false;
}
}
Debugging, it is setting the values to false and returning them when I press the cancel button, but this isn't stopping the postback like every other browser does. It goes straight to the call for the database to delete it.
Any idea why IE11 wouldn't stop the postback after confirm was cancelled?
If I'm hearing you right, don't you mean...?
"onclick", "return Sure(event)"
...
function Sure(evt){
var ans = confirm("Are you sure you want to delete? \n\nPress OK to continue or Cancel to stop.");
if(!ans){
var e = (window.event)? window.event:evt;
e.returnValue = false;
return false;
} else {
return ans;
}
}
From my understanding your script shouldn't work anywhere, even IE11. If you don't "return" the value of the function, you are just executing the function and ignoring the fact the confirm dialog returns "false".
Related
I am developing a project where user gets a conformation page. I want user not to click back or close tab or reload.
Now either I need to disable the browser features or get back button,tab close event, or reload event to java script so that I could take the needed steps to prevent my data to get lost.
I have used this:
window.onbeforeunload = function()
{
return "Try This";
};
But this get called even when I click a button that redirects the page.
If you just want to have the alert, understanding that the user is ultimately in control and can bypass your alert, then do what you're doing but use a flag that disables it when you're navigating and don't want the alert. E.g.:
var warnWhenLeaving = true;
window.onbeforeunload = function() {
if (warnWhenLeaving) {
return "your message here";
}
};
then in a click handler on the link/button/whatever that moves the user on that you don't want this to pop up on:
warnWhenLeaving = false;
In a comment you asked:
can i know that what user has clicked when alert is generated with this function. That is can i know what user has clicked (leave this page/stay on page)
The answer is: Sort of, but not really; you're almost certainly better off not trying to.
But: If you see your onbeforeunload function run, then you know the user is leaving the page and the browser is likely to show them your message. The browsers I'm familiar with handle the popup like an alert: All JavaScript code on the page is blocked while the popup is there. So if you schedule a callback via setTimeout, you won't get the callback if they leave and you will if they stay:
window.onbeforeunload = function() {
if (warnWhenLeaving) {
setTimeout(function() {
display("You stayed, yay!");
}, 0);
return "No, don't go!";
}
};
Live Example
So in theory, if you get the callback, they stayed; if you see an unload event, they left. (Note that there are very few things you can do in an unload event.)
I've tried that on current Chrome, current Firefox, IE8, and IE11: It works on all of those. Whether it will work in the next release of any of them is anybody's guess. Whether it works reliably on mobile browsers is something you'd have to test, and again could change.
I know there are a lot of questions regarding this but nothing is answering me right. I want to show a confirmation dialog when user leaves the page. If the user press Cancel he will stay on page and if OK the changes that he has made will be rollback-ed by calling a method. I have done like this:
window.onbeforeunload = function () {
var r = confirm( "Do you want to leave?" );
if (r == true) {
//I will call my method
}
else {
return false;
}
};
The problem is that I am getting the browser default popup: "LeavePage / StayOnPage"
This page is asking you to confirm that you want to leave - data you
have entered may not be saved.
This message is shown in Firefox, in Chrome is a little different. I get this popup after I press OK on my first confirmation dialog.
Is there a way not to show this dialog? (the second one, that I did not create).
Or if there is any way to control this popup, does anyone know how to do that?
Thanks
Here's what I've done, modify to fit your needs:
// This default onbeforeunload event
window.onbeforeunload = function(){
return "Do you want to leave?"
}
// A jQuery event (I think), which is triggered after "onbeforeunload"
$(window).unload(function(){
//I will call my method
});
Note: it's tested to work in Google Chrome, IE8 and IE10.
This is simple. Just use
window.onbeforeunload = function(){
return '';
};
to prompt when the user reloads, and
window.close = function(){
return '';
};
to prompt when the user closes the page.
But the user have to click on the page once, or do anything on the page for the code to detect. You don't have to put anything the the return'';, because JavaScript interpreter would just ignore it.
window.onbeforeunload = function() {
if (data_needs_saving()) {
return "Do you really want to leave our brilliant application?";
} else {
return;
}
};
I have what I thought was a pretty straightforward javascript issue, but I'm starting to go nuts trying to figure out my problem.
I have a slow page, and it was possible for users to click submit, then click another button while waiting on the page to load, it was creating issues. I thought I could display a please wait message and disable the submit button on click. Below is the function, I am using asp.net 3.5 so there's a name mangling issue, because of this I was using a getElemenetsByName and scanning for the right items (not awesome but it seems to work). When I run this, the button becomes disabled, but then the page just sits there, the server never gets called. I tried in firefox and I didn't see any errors in firebug, but when I set a breakpointon the server, the server def does not get called. I tried returning true in case there was an output expected, but nada. When I commend out the content of processing(){ // stuff } then it works fine, so something in there seems to be killing me.
function processing() {
var pleaseWaitID = "lblPleaseWait";
var submitBtnName = "btnSubmit";
var submitControl = document.getElementsByTagName('input');
var pleaseWaitlbls = document.getElementsByName(pleaseWaitID);
for (pleaseWait in pleaseWaitlbls) {
if (pleaseWaitlbls[pleaseWait].style != null) {
pleaseWaitlbls[pleaseWait].style.visibility="visible";
}
}
for (submitButton in submitControl) {
if (submitControl[submitButton].name != null) {
if (submitControl[submitButton].name.search(submitBtnName) != -1) {
submitControl[submitButton].disabled = "disabled";
}
}
}
return true;
}
.....
asp:Button ID="btnSubmit" name="btnSubmit" SkinID="MainAction" runat="server" Text="Submit" OnClientClick = "javascript:processing();"
OnClick="btnSubmit_Click" meta:resourcekey="btnSubmitResource1"
Any ideas on what I've screwed up here?
Thanks you for your time.
Asp.net Custom user control button. How to stop multiple clicks by user
I had the same type of problem this may or may not help.
When I try to close my Google docs tab with unsaved changes, this is what I get in my browser (FF 3.5).
Are you sure you want to navigate away
from this page?
You have unsaved changes in this
document. Click Cancel now, then
'Save' to save them. Click OK now to
discard them.
Press OK to continue, or Cancel to
stay on the current page.
My question is whether such alerts are part of the web app (gdocs for eg.) or are they given out by the browser? If latter, how is this done?
By the browser. It's the beforeunload event handler that returns the customized text of the dialog, which is only the middle of the three paragraphs - the other two paragraphs as well as the text of the buttons cannot be customized or otherwise changed.
window.onbeforeunload = function(){ return 'Testing...' }
// OR
var unloadListener = function(){ return 'Testing...' };
window.addEventListener('beforeunload', unloadListener);
Will yield a dialog that says
Are you sure you want to navigate away from this page?
Testing...
Press OK to continue, or Cancel to stay on the current page.
You can nullify this by setting the handler to null
window.onbeforeunload = null;
// OR
window.removeEventListener('beforeunload', unloadListener);
The alerts are part of the web application. View the source code and look at the javascript.
Does anyone know how to stop a page from reloading or navigating away?
jQuery(function($) {
/* global on unload notification */
warning = true;
if(warning) {
$(window).bind("unload", function() {
if (confirm("Do you want to leave this page") == true) {
//they pressed OK
alert('ok');
} else {
// they pressed Cancel
alert('cancel');
return false;
}
});
}
});
I am working on an e-commerce site at the moment, the page that displays your future orders has the ability to alter the quantities of items ordered using +/- buttons. Changing the quantities this way this doesn't actually change the order itself, they have to press confirm and therefore committing a positive action to change the order.
However if they have changed the quantities and navigate away from the page I would like to warn them they are doing so in case this is an accident, as the changed quantities will be lost if they navigate away or refresh the page.
In the code above I am using a global variable which will be false by default (its only true for testing), when a quantity is changed I will update this variable to be true, and when they confirm the changes I will set it to false.
If warning is true and the page is unloaded, I offer them a confirmation box, if they say no they would like to stay on this page I need to stop it from unloading. return false isn't working, it still lets the user navigate away (the alerts are there for debugging only)
Any ideas?
onbeforeunload is the one you want; your function "should assign a string value to the returnValue property of the Event object and return the same string". Check the docs from Microsoft and Mozilla for details.
The string you return will be used by the browser to present the user with a custom confirm box, allowing them to refuse to stay there if they so choose. It has to be done that way to prevent malicious scripts causing a Denial-of-Browser attack.
This code warns as per Natalie's suggestion, but disables the warning if a form on the page was submitted. Uses JQuery.
var warning = true;
window.onbeforeunload = function() {
if (warning) {
return "You have made changes on this page that you have not yet confirmed. If you navigate away from this page you will lose your unsaved changes";
}
}
$('form').submit(function() {
window.onbeforeunload = null;
});
you want to use the onbeforeunload event.
window.onbeforeunload = confirmExit;
function confirmExit()
{
return "You have attempted to leave this page. If you have made any changes to the fields without clicking the Save button, your changes will be lost. Are you sure you want to exit this page?";
}
window.onbeforeunload = function() {
if (warning) {
return `You have made changes on this page that you have not yet confirmed.
If you navigate away from this page you will lose your unsaved changes`;
}
}
Isn't supported in chrome, safari and opera
As said in this comment, nothing in jQuery binds to the beforeunload event.
#karim79: no it doesn't. There isn't anything in jQuery that binds to the beforeunload function; "unload" binds to the "unload" event. Search the source if you don't believe me ;-) – NickFitz
So you have to use pure Javascript to bind a function to the beforeunload event.
var warning = true;
$("form").submit(function() {
warning = false;
});
$('#exit').click(function() {
window.location.replace('https://stacksnippets.net/js')
});
window.onbeforeunload = function() {
if(warning) {
return true;
}
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<form>
<input type="submit">
</form>
Try using e.preventDefault() instead of returning false. 'e' would be the first argument to your unload callback.