Develop Reference

How to make the Background behind Alert Box clickable?

I have a application where i make all Divs clickable by using this code :
$("html").click(function(){
alert("Click");
return false;
});
This one work normally for all divs. Well, when Alert popup, the Background behind alert box cannot be clicked. How can i turn that to be clickable too?
PS: Right Click on the Background dont work too.

Thats not possible. You have to use a JS plugin doing the alert, so you can influence the behaviour (like the jquery ui modal widget, mentioned here). But with the browser alert this is not possible, as far as i know.

Not sure how to do exactly what you're asking (if it's possible). Maybe someone else can shed some light on that.
But a solution you could look into would be the dialog widget from jQuery UI. You can easily create pop-ups, modal or non-modal (meaning with the background faded out or not).
http://jqueryui.com/dialog/
They have some demos there, but it's as simple as created a div with some text and calling...
$("#the_div_id").dialog();
Other config parameters can be found from the API:
http://api.jqueryui.com/dialog/

By default its modal popup behaviour ,If you want to clickable
Assuming you are using Jquery Ui dialog
Try with the option modal
$('#selector').dialog("option","modal",false);
http://api.jqueryui.com/dialog/#option-modal

Close event on browser

I am using a jQuery Notification on my project.
When i close the browser , i am using the onbeforeunload and showing a confirm box to the user.
However the client is not satisfied with the default message box ,
is it technically possible to show my Notification instead of the default one.
jQuery notification comes with a question Do you want to close ? and with two buttons YES and No.
When user clicked YES it will return true ,else False
any way to achieve ? or some comments/opinion ?
Please help me .
Thank you.
Update :
window.onbeforeunload = ShowModel;
function ShowModel()
{
return show_pop_up();
}
show_pop_up()
{
return TRUE or FALSE ;
}

is it technically possible to show my Notification instead of the default one.
No. You can specify the text of the message. You cannot control the buttons, you cannot control the appearance, and you cannot replace the UI with one built from scratch out of HTML/CSS/JS.
There are very strong limitations over what you can do while the user is trying to leave the page. Browsers are designed to protect users from sites that attempt to trap them (You are trying to leave the site? NO! You are not allowed to leave until you have looked at more adverts for porn and you given us your credit card details!).

It is possible to show your notification instead the default. Try this:
$(window).on('beforeunload', function() {
return 'Do you really want to close this window? Some your text...';
});
But it's true, you can't limit user's actions with browser's window.

Technically its not possible to override the default UI.
There are two kind of page leave events can occur.
One is to navigate within the same website by clicking the links. For this kind of page unload, you could be able to write the onclick for all the menu links to show the warning message as you wish with the UI styles. But when you click links, you MUST stop the call for the beforeunload event.
The second one is to navigate outside the website using the browser buttons/address bars. Here you can't override the default UI.
The best example is Facebook. When you type the status and before submit, if you try to navigate within FB, you'll be getting a nice UI warning message. But when you close the window, you'll get the default one.
Hope this helps.

Change name of alert in jscript

Is there a way to change the name of a alert dialog box in jscript, like instead of it saying ("Alert" "Message") can it say something like ("Hello" "Message") this is the script im using:
Click Here
Thanks :D

If you want to alias alert it would be:
var t = alert;
t('blah');
If you want to change the text of the alert box's title bar, you can not.

Not as far as I am aware with the default basic Javascript alert() dialog box.
In fact, different browsers will have different title bars on the dialog. Some have "Alert", others have "The page at http://someurl.com says:" and it goes on.
A far prettier, and more customisable option is to consider using something like jQuery UI. It has features like the dialog, which create a nicer, in-page dialog box with customisable buttons, title, and content.
It requires use of the jQuery library, which is a hugely popular Javascript library to greatly ease Javascript development, and plainly, make it more fun.

The best way to implement an alert with a custom title, would be to implement a custom dialog. You may want to look in to using jQuery UI Dialogs. There are many other implementations of custom Dialog controls. Such as SimpleModal Dialog.

The short answer is: no.
However, alert is a host method and browsers can chose to implement it however they like. But all browsers currently do not let script modify the standard alert dialogue. You can create your own alert dialogue though using a suitably styled and positioned element.

If you mean function renaming
<script type="text/javascript">
function hello(msg){
alert(msg);
}
</script>
Click Here

can we have anchors in alerts?

I want to throw an alert message if a user enters a bad username/password and give users an option to hit "ok" which lets them try the page again or "forgot password" which lets them go to a different link to change their password.
Can I use an alert box and add an anchor to it ? I don't want to have a button floating around until someone enters a wrong password.

No. alert() boxes can only display plain text. If you wanted to create your own pop-up box like that you would need to implement it yourself, you couldn't use alert().

You may want to use confirm().
This function shows a message followed by a Ok and Cancel buttons:
if (confirm('You used a wrong password; Would you like to retrieve your password ?')) {
document.location = 'retrieve the password';
}

The built-in alert function won't show hypertext, just text. You can use a fancier implementation from any one of the popular Javascript gui libraries. They will let you create an HTML pop-up instead.

alert does not display HTML. You'll have to emit markup to display the message instead. There are many libraries that can do this for you, including jQuery UI.

That's not possible. You can use the showModalDialog function instead. See the demo at this page.

No, you will have to show the user a custom message. You may want to use absolutely positioned DIV element, a modal dialog window or an iframe for that purpose.

Confirm dialog box on unload/exit UNLESS the back button is pressed?

I have some simple code to display a confirm dialog box when the user tries to leave my form:
window.onbeforeunload = askConfirm;
function askConfirm(){
return "Your answers will be lost.";
}
But this is a multi-page form and they frequently press back to change some values on a previous page.
But when they do this dialog box still comes up.
Is there a way around this?

The answer I would suggest unfortunately doesn't actually answer your question but is a solution of a kind. The only possible solution here, imv, is to make sure that a user clicking the back button doesn't actually create an issue by storing the form answers from all pages. In the case of PHP I would store them in a session ($_SESSION). You have to recognise that users use the back button more than any other UI element within a browser. If your form truly has to be across a number of pages then you need to make sure the data they have entered is persistent across all these pages. I would actually provide a navigation for this within your own interface. Provide a clear sequential process visually and allow instant navigation through this process where possible.

I don't see a way to specifically detect whether the user pressed "back" or any other browser button. This is outside the site's scope.
Only one solution comes to mind: Show the confirmation dialog only when a global flag has been set to "true".
if (ask_when_exiting == true)
return "Your answers will be lost.";
You would have to set the variable to true? in the onclick event of every link that you want the confirmation to pop up for. You should be able to mass apply this event to every link on your page using JQuery or another JS framework (Seomthing like $$('a').each()....).
However, this will disable the confirmation for reloading the page, or any other event that is not triggered using a control on the page like typing in another URL or closing the browser, as well.