How to close jQuery dialog in dialog box?

Question

How to close a jQuery dialog in a dialog without using the close button?

There is a simple form request inside the ui dialog box, and if a successful submission occurs, the ui dialog automatically closes and updates the parent page.

<script type="text/javascript"> $(document).ready(function () { $("#form-dialog").dialog({ autoOpen: true, modal: true, width: 200, draggable: true, resizable: true }); }); </script> <div id="form-dialog" title="Form Submit"> <form action="default.aspx" method="post"> <input type="text" name="name" value=" " /> <input type="submit" value="submit" /> <a href="#" id="btnDone">CLOSE</a> <script type="text/javascript"> $(document).ready(function () { $("#btnDone").click(function () { $(this).dialog('close'); }); }); </script> </form> </div> 

-imperialx

Answer 1

try it

 $(this).closest('.ui-dialog-content').dialog('close'); 

He will close the dialogue within him.

Answer 2

you can close it programmatically by calling

 $('#form-dialog').dialog('close') 

whenever you want.

Answer 3

You need

 $('selector').dialog('close'); 

Answer 4

Close from iframe inside the dialog box:

 window.parent.$('.ui-dialog-content:visible').dialog('close'); 

Answer 5

 $(this).parents(".ui-dialog-content").dialog('close') 

Simple, I want to make sure that I do not:

• .
• Close all dialogs.

Answer 6

After checking all of these answers above, with no luck, the code for working with files worked for me to solve the problem:

 $(".ui-dialog").dialog("close"); 

Perhaps this will be a good attempt if you are looking for alternatives.

Answer 7

replace one line with

 $("#form-dialog").dialog('close'); 

$ (this) here means another object $ ("# btnDone")

  <script type="text/javascript"> $(document).ready(function () { $("#form-dialog").dialog({ autoOpen: true, modal: true, width: 200, draggable: true, resizable: true }); }); </script> <div id="form-dialog" title="Form Submit"> <form action="default.aspx" method="post"> <input type="text" name="name" value=" " /> <input type="submit" value="submit" /> <a href="#" id="btnDone">CLOSE</a> <script type="text/javascript"> $(document).ready(function () { $("#btnDone").click(function () { //I've replaced next string // $(this) here means another object $("#btnDone") $("#form-dialog").dialog('close'); }); }); </script> </form> </div> 

Answer 8

 $(document).ready(function () { $("#form-dialog").dialog({ autoOpen: true, modal: true, width: 200, draggable: true, resizable: true, buttons: { "Close": function () { $("#idDialog").dialog("close"); } } }); }); 

This will force you to close the button. you can also call the close function

 $("#idDialog").dialog("close"); 

in some function for this. or even using the / a button

 < a href="javascript:void(0);" id="btnDone" onClick="$("#idDialog").dialog("close");">CLOSE</a> 

EDIT: you need this to include your dialog in the form:

 open: function (type, data) { $(this).parent().appendTo($("form:first")); } 

Answer 9

Adding this link to open

 $(this).parent().appendTo($("form:first")); 

works great.

Answer 10

it is better to "destroy and delete" instead of "close" it will remove the "html" dialog from the DOM

 $(this).closest('.ui-dialog-content').dialog('destroy').remove(); 

Answer 11

Using $(this).dialog('close'); It works only inside the function of pressing a button in modal mode. If your button is outside the dialog box, as in this example, specify the selector:

 $('#form-dialog').dialog('close'); 

See the documentation for more information .