How to collect value of dialog box - javascript

I am displaying a warning dialog box on window close event. If user clicks on Cancel control stays on same page or if user clicks on Okay he get navigated to desired page.
I want collect the value of dialog box means whether user have clicked on Cancel or Okay.I have written following code in external JavaScript:
$(document).ready(function()
{
window.onbeforeunload = askConfirm;
function askConfirm()
{
if (flag)
{
// Message to be displayed in Warning.
return "Your unsaved data will be lost.";
}
}
}
How can I collect the value?

<script type="text/javascript">
window.onbeforeunload = function (evt) {
return "Are you sure to close?";
}
</script>
example code
http://files.dropbox.com/u/642364/blogger/scripts/close.html
EDIT
Getting the response code from the user on window close
<body onUnload = "CheckIt ()" >
...
</body>
<script>
function CheckIt ()
{
var response = confirm ("Are you closing..");
alert (response); // do whatever for response.
}
</script>

Related

Fire dialog box when user clicks on external links

There goal is to prevent users from redirect on accidental clicks on external links, when user fills up the form.
Problem: the whole code has to be abstract. I don't know which links user clicks, I don't know whether the form is fully or partly filled.
If the form is empty, then redirect user without dialog/confirmation box.
Here's code:
function exit_confirm(event) {
let url;
if (event.target.nodeName === "a") {
url = event.target.getAttribute('href');
}
if (window.confirm('Do you want to leave the site?')) {
window.location.href = url;
}
}
function getAllElementsWithDataAttribute() {
return document.querySelectorAll('*[data-]');
}
function registerOnClickChangeKeydownEventsOfElementsWith() {
let elementsWithDataAttribute = getAllElementsWithDataAttribute();
['click', 'change', 'keydown'].forEach(evt => {
elementsWithDataAttribute.addEventListener(evt, exit_confirm, false);
});
}
The code is not a final version.
I have to get url from a clicked link and pass it to window.location.href
I also need to check a clicked link if it is an external link.
*[data-] - here has to be smthing that defines the link

clicking the button in the alert box or overriding the window.alert()?

I have a web application window where I'am required to press a button to remove some stuff many times (the button is easily click-able with JS by selecting it with getElementbyClassName()[i]). But after each click I have to manually press the "OK" button on the window.alert("Are you sure?"); box.
I can't change the websites mechanism as I'm not the owner or developer. But I want somehow to be able to automate this stuff.
JS I use for clicking on the element:
var el = document.getElementsByClassName('ruleAddButton');
for (var i = 0; i < el.length; i++) {
el[i].click();
}
Since alert is only to show info to the user (you can't get user input from an alert), I think you maybe want to monkey patch confirm function this way:
var originalConfirm = window.confirm;
window.confirm = function(msg) {
if (msg.match(/Are you sure/) {
// this confirm should return always true
return true;
} else {
// we want other confirms works as normal
return originalConfirm.bind(window)(msg);
}
}
Just in case, I would do the same trick for alert function
var originalAlert = window.alert;
window.alert = function(msg) {
if (msg.match(/Are you sure/) {
// this is what alert always returns after user clicks OK
return undefined;
} else {
// we want other alerts works as normal
return originalAlert.bind(window)(msg);
}
}
EDIT
Also, you can do something as simple as:
window.confirm = function() { return true; };
But on this case, be aware that ALL confirm calls will be intercepted
You can't click the OK button in a dialog created by window.alert. That dialog is created by the browser and is not controllable from the webpage's JavaScript context. However, what you can do is just monkey-patch the alert function to not show a dialog at all:
window.alert = function() {
// Do nothing.
};
You can override the alert function:
window.alert = function(){}
But it will disable all alerts on this page.

Dojo addOnUnload function : How to include confirmation

I have some dojo code as below:
<script type="text/javascript">
dojo.require("dojo.io.script");
var unload = function refreshParent(){
confirmExit();
}
dojo.addOnUnload(window, "unload");
</script>
function confirmExit()
{
var r=confirm("Are you sure you want to close the window without saving it?");
if (r==true)
{
window.returnValue=true;
window.close();
}
else
{
return false;
}
}
The scenario is: On clicking on close for a window, the dojo unload gets called which closes the window.
However, I want a dialog box which asks for confirmation about the closing and if the user hits Cancel, the closing of the window should be disposed off.
However, currently, no matter what I do, the window is getting closed.
What could be the solution to this ?
You have to return the confirmExit value
var unload = function refreshParent(e){
return confirmExit();
}

FormNavigate with confirm box yes no button

When a user leaves a JSP page, I need to display a confirmation with yes no button "You have unsaved changes. Do you want to leave it without saving?". If the user presses "ok", then the user goes to the page s/he is navigating to. Otherwise, if "no" is pressed, the user stays on the page. My code is here:
var formdata_original=false;
jQuery(".outConfirmPlugin").click(function () {
if (formdata_original == false) {
con();
}
return formdata_original;
});
function con() {
$.confirm({
'title':'',
'message':settings.jsMessage,
'buttons':{
'Yes':{
'class':'blue',
'action':function () {
formdata_original = true;
}
},
'No':{
'class':'gray',
'action':function () {
}
}
}
});
};
I know my error is: function "con" and "return formdata_original;" - they are not synchronized. How can i do this?
try return simple value from you function, i mean
action':function () {
return true;
}
and when you call 'con' function you will be able to write
formdata_original = con();
In this case you can not worry about sinhronize
The second option is creation global object that belongs ot window or $. So try
window["formdata_original"] = false
and in your code inside confirm dialog
window["formdata_original"]=true.

Don't allow refresh webpage

I have a link:
rename
which invokes isRename() function:
function isRename(){
var i = getCheckboxCount();
if(i==1){
showInputDialog(getCheckboxName(),'Rename', 'Enter the name of file/directory',null);
}
}
function showInputDialog(a,b,c,okFunc){
$.fn.InitInputDialog(a,b,c,okFunc);
$.fn.fadeInCommon();
};
It shows a modal window. This window has a close button.
$("#CloseInputButton").off('click'); //MY CLOSE BUTTON IN MODAL WINDOW
$("#CloseInputButton").click(function(){
fadeOutCommon();
});
$.fn.fadeOutCommon = function(){
//transition effect
$('#mask').fadeTo("slow",0.0,function(){
$(dialogID).hide();
$('#mask, .window').hide();
});
};
It works fine before I press the close button. My web page refreshes and fadeOutCommon animation doesn't work at all! I think it happens because of refreshing web page! How can I disable refreshing web page?
Thanks
Just write down return false; will do that task.
rename
function isRename(){
var i = getCheckboxCount();
if(i==1){
showInputDialog(getCheckboxName(),'Rename', 'Enter the name of file/directory',null); }
return false;
}
Also have look to
e.preventDefault() will prevent the default event from occuring, e.stopPropagation() will prevent the event from bubbling up and return false will do both.
you can put return false in your click methods
$("#CloseInputButton").click(function(){
fadeOutCommon();
return false;
});
To prevent reloading, use
window.onbeforeunload = function() { 'some function that does not reload the page' }

Categories