Web Development with jQuery

Chapter 17Dialog

This chapter presents how to work with the jQuery UI Dialog plugin, which provides pseudo-pop-up windows created using markup, CSS, and JavaScript.

Unlike pop-up windows, which require that you open a new document in a separate browser window that is increasingly saddled with security limitations, such as being unable to hide the URL of the document and being unable to hide the status bar at the bottom of the window, dialogs created using markup, CSS, and JavaScript can be styled in any way that you like and can impose any limitations that you like. For example, you have the ability to make a modal dialog, which provides a dialog and prevents the user from continuing to interact with the document until the dialog is closed.

Another difference between pop-up windows and dialogs (as I will now refer to this widget for the remainder of this chapter—without reiterating the fact that they are generated by markup, CSS, and JavaScript) is that dialogs cannot leave the browser window in which they reside. So a dialog cannot be minimized to your operating system's taskbar, although you could possibly create your own minimization script so that the dialog can be minimized within the browser window.

As with many of the things that you learned in this book, jQuery UI again leaves little to be desired in its implementation of dialogs.

Implementing a Dialog

As with every other jQuery UI plugin, this discussion of the Dialog plugin begins with a demonstration of what the ...