Web Development with jQuery®

(Elliott) #1

Controlling Dynamic Interaction (^) ❘ 411
In the preceding script, you prevent the dialog from being opened automatically by setting the
autoOpen option to false. To open the dialog, you attach a click event to the element, and
when that event takes place, you make a call to $('div#exampleDialogOpen').dialog('open') to open
the dialog programmatically. Figure 17-4 displays the preceding example.


FIGURE 17-4


CONTROLLING DYNAMIC INTERACTION


By default, the jQuery UI Dialog plugin enables you to resize and drag the dialog window. Both
types of dynamic interaction with a dialog can be disabled by passing options to the dialog()
method. For example, the draggable option can be set to false to disable dragging the dialog, and
the resizable option can also be set to false to disable resizing a dialog. Disabling these options is
demonstrated in the following script, Example 17-6:

$(document).ready(
function()
{
$('div#exampleDialog').dialog({
title : 'Example Dialog',
modal : true,

http://www.it-ebooks.info

Free download pdf