Dialog Boxes in Java Script


Dialog Boxes in Java Script

Sometimes dialog box may use to display warning message, for confirmation message and to get user information with "Ok", "Ok" and "Cancel" button.

Three Types of Dialog Boxes Available
  • Alert dialog box
  • Confirmation dialog box
  • Prompt dialog box

Alert Dialog Box

It is used to show a message in the dialog box, and there is an OK button. It is mostly used to prompt message if user missed input value or invalid data in given form or text. It is supported by all major browsers.

Javascript Alert Dialog Box Example

<html>
<head>
<title>Javascript Alert Dialog Box Example</title>
</head>
<body>
<form name="myform">
<input type="button" value="Alert Dialog" onClick="alert('Welcome to JavaScript!!!')"/>
</form>
</body>
</html>

Confirm Dialog Box

It is used to show a message box with "Ok" and "Cancel" button. It is mostly used to take user confirmation on any option. Confirm displays a dialog box with two buttons: OK and Cancel. If the user clicks on OK the window method confirm() will return true. If the user clicks on the Cancel button confirm() returns false.

Javascript Confirm Dialog Box Example

<html>
<head>
<title>Javascript Confirm Dialog Box Example</title>
<SCRIPT LANGUAGE="JavaScript">
function respConfirm () {
     var response = confirm('Please confirm, do you want to continue?');
     if (response)
alert("You say YES/OK!");
     else
alert("You say No/Cancel!");
}
</SCRIPT>
</head>
<body>
<form name="myform">
<input type=button value="Confirm Dialog" onClick="respConfirm();"/>
</form>
</body>
</html>

Prompt Dialog Box

The prompt dialog box are most commonly used to allow user to enter information. It takes two parameters; a message which you want to display in the text box and default string for the text entry field. Prompt dialog box has two buttons: OK and Cancel.

If the user types something and then clicks OK or presses Enter, the prompt method returns the user input string. If the user clicks OK or presses Enter without typing anything into the prompt dialog, the method returns the suggested input, as specified in the second argument passed to prompt.

If the user dismisses the dialog (e.g. by clicking Cancel or pressing Esc), then in most browsers the prompt method returns null.

Javascript Prompt Dialog Box Example

<html>
<head>
<title>Javascript Prompt Dialog Box Example</title>
<SCRIPT LANGUAGE="JavaScript">
function respPrompt() {
     var name = prompt('What is your name?', 'type your name here');
     alert("Your name is: " +  name);
}
</SCRIPT>
</head>
<body>
<form name="myform">
<input type=button value="Prompt Dailog" onClick="respConfirm();"/>
</form>
</body>

</html>

Comments

Popular posts from this blog

પટેલ સમાજનો ઈતિહાસ જાણો : કોણ અને ક્યાંથી આવ્યા હતા પાટીદારો

Python HTML Generator using Yattag Part 1

Java Event Delegation Model, Listener and Adapter Classes