Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>If you want to know why the dialog is closing as soon as you click anywhere in your dialog. You have added a <code>.click()</code> event listener to the whole document, every time a click occurs, it will run your callback function <code>overlayclickclose()</code>.</p> <p>That is checking to see if you want to close the dialog:</p> <pre><code>if (closedialog) </code></pre> <p>As <code>closedialog</code> is always <code>1</code> which as a boolean is <strong>true</strong> any click anywhere will close the dialog. Your function will basically say <code>if (true)</code> do something, so will always 'do something'.</p> <p>If you change your focus event to:</p> <pre><code>closedialog = 0; </code></pre> <p>Close dialog is now <code>0</code> which as a boolean is <strong>flase</strong> so the dialog wont close.</p> <p><a href="http://jsfiddle.net/xsEH9/" rel="nofollow noreferrer"><strong>See it working here</strong></a></p> <p><a href="http://jsfiddle.net/xsEH9/1/" rel="nofollow noreferrer"><strong>See it not working as you have it here</strong></a></p> <hr> <p>After a quick search, it looks like the code you are using is something very similar to <a href="http://www.jensbits.com/2010/06/16/jquery-modal-dialog-close-on-overlay-click/" rel="nofollow noreferrer"><strong>this tutorial</strong></a> - see the use of <code>1</code> and <code>0</code> for the <code>closedialog</code> variable.</p> <hr> <p>There is another way you can do this, its probably easier to follow in code. <a href="https://stackoverflow.com/questions/1092940/jquery-ui-1-7-1-modal-close-on-overlay-click">See the question here</a>. You can change your code to something like this:</p> <pre><code>$('#mydialog').dialog({ bgiframe: true, autoOpen: true, modal: true, width: 300, height: 200, resizable: false }); $('.ui-widget-overlay').live('click', function() { $('#mydialog').dialog('close'); }); </code></pre> <p><a href="http://jsfiddle.net/xsEH9/2/" rel="nofollow noreferrer"><strong>See it working here</strong></a></p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload