How to show confirm box like StackOverflow's confirmation box? - javascript

Ask a question, and while editing the body of your question, click on some link on the page. StackOverflow's script knows that you are not finished yet, and warns you about loosing your unsaved data. However, it's confirmation box is not a jQuery plugin, or anything like that. It seems that its confirmation box is browser-specific box, something like JavaScript's confirm box. To prove it, simply check it in many browsers and you see different UI styles.
How they've done it? Which JavaScript command?

The onbeforeunload Javascript event is what you're looking for.

Trying setting a global flag to know when the page is "editing" and then use the onbeforeunload event
window.onbeforeunload = function(){ return globalEditingFlag ? 'You are editing': null }

Look at this :
http://www.w3schools.com/js/js_popup.asp
The section about the confirm box

Related

How to disable 'Changes you made may not be saved' when clicking an anchor tag

I have a site built with Asp.Net mvc where I show a list of products and automatically fill in the default purchasing amount for those products in each corresponding input field.
However when i navigate to a different product catalog using the anchor tag the 'Changes may not be saved' alert pops up presumably because of the default values entered in the input fields.
Now I have tried to disable this alert using the following in my shared layout page inside of a script tag:
window.onbeforeunload = null
window.beforeunload = null
I have also tried various answers from similar questions but nothing seems to help.
Does anyone know how I can get rid of this alert?
Thanks in advance.
You may have more success using this for jQuery:
$(window).off('beforeunload');
You can also read about some of the caveats and potential pitfalls of the beforeunload event here.
Update:
Just to clarify a point further from a comment #Jamiec left, the event should be triggered in your project somewhere, try searching for beforeunload to see where it originates.
Apparantly the alert was being called from a directive created by a colleague, by disabling this directive the alert no longer appears.
Thanks to Jamiec for notifying me.
Using Jquery Try below code.
$(window).off('beforeunload');
This is best option for changes that you made may not be saved popup.
If you use javascript then you can use below code,
window.onbeforeunload = function () {return null;};

Is there a default focus and select behaviour following a JavaScript alert being clicked?

As per the title, is there a default focus and select behaviour following a JavaScript alert being clicked?
The reason I ask is that I have a JavaScript function validating an asp.net text box in a web forms application. I added a JavaScript alert to the function to help with debugging and the behaviour seemed to change. When I clicked on the OK button of the alert it then set the focus to the field I was validating and selected the text.
I thought it must be something in my code causing this behaviour so I commented out all the instances where I was setting focus and select, but still saw the same behaviour. As soon as I removed the alert it went back to behaving as expected and no longer selected the data in the text box.
Does this sound like it could be related to the JavaScript alert or just something odd going on in my code?
There is auto focus in html5, but the issue here seems like different. If the alert is a custom alert functionality try to remove that and add window.alert() function instead. These are wild guesses, it would e great if you can post your code block here?

prevent this page from creating additional dialogs

I am currently working on project and i have requirement to use java script input dialog to take input from user
see example
now i want to remove this check box which says that prevent this page from creating additional dailogs
how i can remove this message from alert box
You cant remove because it's introduced by browser.
To solve you problem try to employ http://bootboxjs.com/, whit this library you ca do the same by writing:
bootbox.prompt("Enter password please", function(result) {
// do something whit result
});
You can't remove this as it's a browser security feature. You should probably look at other ways of presenting your dialog - use a modal window instead for example.
So what you want to do it's IMPOSSIBLE. Since it's a browser functionality.
Anyway I advice you to use a Model-Box.
You will:
- Prevent that from happen
- Beautify your website.
You may want to check this: http://www.fallr.net/ I've used it's pretty cool and easy. Tou have the PROMPT-LIKE example wich returns you something written by the user. You can also have a CALLBACK to some AJAX function for example.
So you can't remove it make that clear for you at least for now.
Dont use alert system boxes they are ugly.. really..
Hope it helped!
i fount the answer
We have two different things going on here...
I'm suggesting adding a preference to about:config (or user.js in your
profile folder).
Copy the preference name dom.successive_dialog_time_limit Open
about:config Right-click in the preferences area and choose New >
Integer Paste the preference name and click OK Then enter 0 and click
OK
for more details chek this link
Prevent this page from creating addtional dialogs

How to show the confirmation alert with one button using javascript?

In my application, i need to show the message in alert with OK button.
In that button click event, i want to do some functionalities using the javascript.
So, how can i do this in my app?
Please let me know?
I'm not entirely sure what you are trying to do, but you may be looking for the window.confirm function, which is a built-in function like alert that allows you to capture the response (true or false) from the user:
if(confirm("Some message")) {
//Clicked ok
} else {
//Clicked cancel
}
If you want more functionality than that I'm afraid you'll have to look elsewhere. There are endless modal scripts and libraries available, so just search for one that suits your needs.
Having re-read your question title, maybe you just want the normal window.alert function? That will display a dialog with one button, and, in general, prevent execution of the code following it until the user has closed it:
alert("Some message");
If you'll be using alert() then the execution of javascript will stop where the alert is written. And after the OK button is pressed, the code execution will resume.
So, do an alert(message); and after that line, put the code you want to be executed after the OK button is pressed.
If you want more control, you can use jQuery UI Dialog.
Forget about built-in popups. Even if you make it work you'll probably hit some cross-browser issues and you won't be able to sleep (trust me: I know what I'm saying, I've been there). :)
I've been using jQuery UI ( link ) for some time and I am really satisfied with. Give it a try!
Here's a simple example
if (confirm("Select a button")){
alert("You selected OK");
}else{
alert("You selected Cancel");
}
But if you're just looking for a popup with one button I would go for the alert()
alert("Press OK to close!");
For more popup examples, go to w3schools

Is it possible to get Message Box in web forms?

I tried but I guess Message Box only works with win forms. What is the best alternative to use in web forms?
You can use confirm for yes/no questions and alert for "OK" messages in JavaScript.
The other alternative is to use JavaScript to pop up a new window that looks and acts like a message box. Modality in this case varied by browser. In Internet Explorer, the method
window.showModalDialog(url,name,params)
will display a modal dialog. The Mozilla approach is to still use
window.open(url,name,params)
but add modal=yes to the params list.
result = confirm('Yes or no question here.')
JavaScript:
alert("This box has an OK button.");
The Ajax ModalPopup also works nicely. Here is an example:
http://www.asp.net/ajax/ajaxcontroltoolkit/samples/modalpopup/modalpopup.aspx
You have dojo dialog widget: http://www.dojotoolkit.org/ and you can use it as a message box.

Categories