Close JQuery Ui dialog from ajax loaded content

I'm trying to add a close a jquery ui dialog box from an ajax loaded content.

开发者_开发问答

Here is some code :

    <script>
        $(".add_as_friend").click(function(){
            $("#dialog-modal").load("/friends/add_popup/"+$(this).attr('id')).dialog({
                title: sprintf('<?=_("Ajouter %s comme ami");?>',$(this).attr('rel')),
                width: 500,
                height: 350,
                modal: true,
                buttons: {
                    "<?=_("Annuler");?>": function() {
                        $( this ).dialog( "close" );
                    }
                }
            });
        });
    </script>

and the call to close it from the ajax would be something like

$(".add").click(function(){
  //submit a form 
  // close modal box and redirect main window
});

---

You could try calling the dialog.close() method on the div you turned into a dialog.

$(".add").click(function(){
  $('#dialog-modal').dialog('close');
});

---

You can use the .dialog( "close" ) method in jQuery UI itself.

---

The modal box is actually in the same window, so you could get by with simply redirecting from the click handler. If you really want to do the close, simply invoke the close method on the dialog.

 $('.add').click( function() {
      $.ajax( $('form').attr('action'), $('form').serialize(), function(data) {
             // optional since we're unloading the page
            $('#dialog-modal').dialog('close');
            location.href = data.RedirectUrl;
      });
 });