I have the following JavaScript:
var leave_page_confirm = true;
function save_data_check() {
var msg;
if (leave_page_confirm === true) {
$('.input-right').each(function() {
if (this.value) {
msg = 'You have unsaved data on this page.';
return false;
}
});
}
return msg;
}
window.onbeforeunload = save_data_check;
This confirm box displays when you have unsaved data in a form on my pages.
However, when it appears the emphasis (default button) is "Leave This Page" I would like the emphasis to be on "Stay on This Page" despite quite a bit of Googling, I can't seem to find any code that changes the emphasis of the buttons on a confirm alert.
Is there any way to accomplish this?
You might want to refer to this question:
How to personalize alert buttons - window.confirm() and window.alert()
Basically, you can't. But you can make your own modals for this kind of thing and have full control over what it looks like and which buttons are emphasized.
You just can't do this.
Here's the docs https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onbeforeunload
BTW, you can try to find out another way to say users about unsaved data. It might be a UI solution, some outlines, messages etc.
Related
Hey guys I am trying my best to figure it out how to remove the Javascript prompt/confirm that says "Do you want to leave this site?" like this:
https://prnt.sc/famast
Basically what's happening here is that when a modal got opened and the user click on "YES" it will redirect to a page. But I don't want the JavaScript confirmation but just redirect it to that page.
Any idea if you know some scripts that could make it happen?
Please help!
As other said above me, you can do it with onbeforeunload:
window.onbeforeunload = function() {
return '';
// The browser shows a pre-defined message so you don't have to write your own
}
You can also use addEventListener, in this way:
window.addEventListener('beforeunload', function() {
return '';
});
See an example (Link updated)
I need to prompt a user when they are leaving my ASP.Net page unexpectedly with a message to ask if they are sure they want to leave. A post back or when the save button is clicked should not fire the warning. There are a bunch of articles covering this but I am brand new to this and appear to have got my wires crossed.
The recommended way appears to be to use the window.onbeforeunload event but behaves unexpectedly for me. This is fired when the page loads as opposed to when the page unloads.
<script language="JavaScript" type="text/javascript">
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?";
}
</script>
If I use the JQuery implementation it fires when the page unloads but the problem is it fires before the code behind is executed. So I cannot set a variable on the client saying don’t fire the event this time as it is a post back or a Save.
$(window).bind('beforeunload', function () {
return 'Are you sure you want to leave?';
});
Can anyone point me in the correct direction as I know I am making basic mistakes/miss-understanding?
Edit:
So I am nearly there:
var prompt = true;
$('a').live('click', function () {
//if click does not require a prompt set to false
prompt = false;
});
$(window).bind("beforeunload", function () {
if (prompt) {
//reset our prompt variable
prompt = false;
//prompt
return true;
}
})
Except the problem is in the above code I need to be able to differentiate between the clicks but I haven't been able to figure that out yet i.e. I am missing a condition here "//if click does not require a prompt set to false".
Any ideas?
Thanks,
Michael
You can try using this:
$(window).unload(function(){
alert('Message');
});
In case people are interested this is the roundabout solution to my problem. How to tell if a page unload in ASP is a PostBack
I want to add a confirm dialog to a delete button to ask the user whether it is ok or not deleting the selected item.
If not, nothing should happend, else a url should be executed.
I know how to realize this via some Javascript code but I am looking for a solution that has less code. I mean e.g. :
Delete
Is it possible to put the whole functionality in the onClick element without having some extra Javascript in the header?
You can return the confirm() (which returns true/false), like this:
Delete
You can test it here
Better (though far from ideal!): turn it around. Don't let the link do anything, unless you got JavaScript:
<a href="#"
onclick="if confirm('Sure?') { window.location='http://mysite.de/xy/delete';}">
Click to delete
</a>
This at least prevents the link to work without JavaScript. This also reduces the risk of the link accidentally being crawled by Google, or even by some local plugin. (Image if you had a plugin that would try to load/show as thumbnail) the target page on hover of a link!)
Still, this solution is not ideal. You will actually browse to the url, and the url might show up in the history because of that. You could actually delete Bob, create a new Bob, and then delete that one by accident by just clicking 'back' in the browser!
A better option would be to use JavaScript or a form to post the desired action. You can make a request to the server with the POST method, or arguably better, the DELETE method. That should also prevent the urls from being indexed.
Consider what happens if the user has javascript disabled, or if google comes along and spiders the link. Will your entity be deleted?
A better way would be to post a form to delete.
There is a jQuery plugin that does just that: jquery.confirm.
Example:
Go to home
JS code:
$('.confirm').confirm();
If the user confirms, he is redirected to the link of the <a>, else nothing happens.
You can use this:
Download a bootboxjs from:[1]: http://bootboxjs.com/
Create the Button (HTML)
<button type="submit" id="btn">Delete</button>
Call the Dialog:
var myBtn = document.getElementById('btn');
myBtn.addEventListener('click', function(event) {
bootbox.confirm({
size: "small",
message: "Are you sure?",
callback: function (result) {
/* result is a boolean; true = OK, false = Cancel*/
if (result == true) {
alert("ok pressed");
}
else {
alert("cancel pressed");
}
}
})
});
I have a silverlight application and I want to capture the close event of the browser. So what I did, in my .aspx page i have this code
function closeIt() {
return "Any string value here forces a dialog box to \n" +
"appear before closing the window.";
}
window.onbeforeunload = closeIt;
If this functions triggered, a popupwindow will appear, you have 2 buttons OK and CANCEL.
Is there a way in silverlight or in server side to get the value of what the user clicks?
Thank you
I am not sure I totally understand your question, it looks like you are writing javascript. But your subject is silverlight. Anyway....
The simplest way is to leverage Html Confirm either in silverlight:
bool result = System.Windows.Browser.HtmlPage.Window.Confirm("Really..?");
or in straight JavaScript:
var result = window.Confirm("Really...?");
To get the value to the server you can store the value in a hidden text field and post it to the server.
Why don't you use MessageBox ? here's code example:
MessageBoxResult result = MessageBox.Show("Text","Title",MessageBoxButton.OKCancel);
if (MessageBoxResult.OK==result)
{
}
else if (result == MessageBoxResult.No)
{
}
this will get you a popup window with OK and CANCEL window with pretty easy way to determine whether user clicked Ok or no.
The answer is pretty much the same as my other answer to your prior question re window.close.
When the user selects Cancel absolutely nothing happens. If they select OK then your Application_Exit will run.
I want to know how can I display a confirmation box when the users try to get out of the page, like this one here in StackOverflow when you try to close the "Ask Question" page.
Thanks you in advance.
Actually, all that is necessary is this:
window.onbeforeunload = function(){ return "You should save your stuff."; }
This is also kind of a dupe of this: How to show the "Are you sure you want to navigate away from this page?" when changes committed?
In javascript, attach a function to window.onbeforeunload, like so:
window.unbeforeunload = function (e)
{
// return (prompt ('Are you sure you want to exit?'));
// EDIT: Amended version below:
var e = e || window.event;
if (e) e.returnValue = 'Your exit prompt';
return 'Your exit prompt';
}
EDIT:
As the comments below indicate, I had misunderstood the working of the event. It should now work as intended.
Ref: window.onbeforeunload (MDC)
probably a dupe: How do you prevent a webpage from navigating away in JavaScript?, but you can do this by adding an delegate to the window.onbeforeunload event
<script type="text/javascript">
window.onbeforeunload = function() {
//will show a dialog asking the user if
//they want to navigate away from the current page
// ok will cause the navigation to continue,
// cancel will cause the user to remain on the current page
return "Use this text to direct the user to take action.";
}
</script>
Update: doh! updated code to do what the OP really wanted :D
You want to catch the onbeforeunload event of window. Then if you return a string, the browser will display your message in a prompt. Here's an article with sample code.
You can use the window.onbeforeunload event to catch this. If there is any value inside the textarea then an alert message is shown.
That's browser based.
As long as you implement <form> tag, and you type in something in the form, and in Google Chrome, it will prompt you that message.