Sams Teach Yourself JavaScript in 24 Hours

Displaying Dialog Boxes

The window object includes three methods that are useful for displaying messages and interacting with the user. You've already used these in some of your scripts. Here's a summary:

window.alert(message) displays an alert dialog box, shown in Figure 10.3. This dialog box simply gives the user a message.

Figure 10.3. A JavaScript alert dialog box displays a message.
window.confirm(message) displays a confirmation dialog box. This displays a message and includes OK and Cancel buttons. This method returns TRue if OK is pressed and false if Cancel is pressed. A confirmation is displayed in Figure 10.4.

Figure 10.4. A JavaScript confirm dialog box asks for confirmation.
window.prompt(message,default) displays a message and prompts the user for input. It returns the text entered by the user. If the user does not enter anything, the default value is used.

To use the confirm() and prompt() methods, use a variable to receive the user's response. For example, this statement displays a prompt and stores the text the user enters in the text variable:

text = window.prompt("Enter some text","Default value");

Did you Know?

You can usually omit the window object when referring to these methods because it is the default context of a script (for example, alert("text")).

Creating a Script to Display Dialog Boxes

As a further illustration of these types of dialog boxes, Listing 10.4 shows an HTML document that uses buttons and event handlers to enable you to test dialog boxes.

Listing 10.4. An HTML Document That Uses JavaScript to Display Alerts, Confirmations, and Prompts

<html> <head><title>Alerts, Confirmations, and Prompts</title> </head> <body> <h1>Alerts, Confirmations, and Prompts</h1> <hr> Use the buttons below to test dialogs in JavaScript. <hr> <form NAME="winform"> <p><input TYPE="button" VALUE="Display an Alert" onClick="window.alert('This is a test alert.'); "></p> <p><input TYPE="button" VALUE="Display a Confirmation" onClick="window.confirm('Would you like to confirm?');"></p> <p><input TYPE="button" VALUE="Display a Prompt" onClick="window.prompt('Enter some Text:','This is the default value');"> </p> </form> <br>Have fun! <hr> </body> </html>

This document displays three buttons, and each one uses an event handler to display one of the dialog boxes.

Figure 10.5 shows the script in Listing 10.4 in action. The prompt dialog box is currently displayed and shows the default value.

Figure 10.5. The dialog box example's output, including a prompt dialog box.

[View full size image]

Index: [SYMBOL][A][B][C][D][E][F][G][H][I][J][K][L][M][N][O][P][Q][R][S][T][U][V][W][X][Y]

Main Menu

	More Books
	PHP Hacks
	Processing Xml With Java - A Guide To Sax, Dom, Jdom, Jaxp, And Trax
	The Koran (Holy Qur'an)
	Macromedia Flash 8 Bible
	Search Engine Optimization for Dummies
	YouTube Traffic
	PHP 5 for Dummies
	Harry Potter and The Chamber of Secrets
	Harry Potter and the Sorcerer's Stone
	The Pilgrim's Progress
	Wireless Hacks
	Flash Hacks. 100 Industrial-Strength Tips & Tools
	PayPal Hacks. 100 Industrial-Strength Tips and Tools
	Amazon Hacks
	Pdf Hacks
	The Da Vinci Code
	Google Hacks
	The Holy Bible
	Windows XP For Dummies
	Harry Potter and the Half-Blood Prince
	Seo Book
	Upgrading and Repairing Networks
	Macromedia Dreamweaver 8 UNLEASHED
	Windows XP Annoyances
	Windows XP Hacks
	Microsoft Windows XP Power Toolkit
	Teach Yourself MS Office In 24Hours
	iPod & iTunes Missing Manual
	PC Hacks 100 Industrial-Strength Tips and Tools
	PC Overclocking, Optimization, and Tuning - 2th Edition
	PC Hardware In A Nutshell 3rd Edition
	PC Hardware in a Nutshell, 2nd Edition
	Upgrading and Repairing PCs
	Google for Dummies
	MySQL Cookbook
	Teach Yourself Macromedia Flash 8 In 24 Hours
	PHP CookBook
	Sams Teach Yourself JavaScript in 24 Hours
	PHP5 Manual

Free Games Paper Airplanes

500 Kostenlose Spiele

Sams Teach Yourself JavaScript in 24 Hours

Displaying Dialog Boxes

Figure 10.3. A JavaScript alert dialog box displays a message.

Figure 10.4. A JavaScript confirm dialog box asks for confirmation.

Creating a Script to Display Dialog Boxes

Listing 10.4. An HTML Document That Uses JavaScript to Display Alerts, Confirmations, and Prompts

Figure 10.5. The dialog box example's output, including a prompt dialog box.