How can close jquery popup box on success?

Question

In my page I have a link. After clicking on this link, it's showing a jquery popup box. html code is below :

<input class="modal-state" id="modal-1" type="checkbox" />
   <div class="modal">
     <label class="modal__bg" for="modal-1"></label>
       <div class="modal__inner">
     <label class="modal__close" for="modal-1"></label>    
   <div id="showdoc"></div>    
  </div>

This popup box has a cross (X) icon to close this popup box. Now I want to close this popup box on the ajax/jquery success method without clicking on the cross (X) icon. How can I do this ?

here is ajax/jquery success method :

success: function (data) {
        $('#result').html('');
        $('#result').show();
        $('#addcontact-img').hide();                            
        getProjectForm(<?php echo $pid; ?>);
        $(".modal__close").dialog( "destroy" );

         $.each( data, function( key, value ) {          
         if(key !== 'error') {
            $('#result').append('<p>'+value+'</p>');              
          }
   });

I used $(".modal__close").dialog( "destroy" ); but it's now working. If i use $(".modal").fadeOut(500); , then on success it closes automatically but again it's not open by clicking on the link. I don't know how I can fix it.

Answer 1

假设您有关联的对话框.modal ，则需要使用

$(".modal").dialog("destroy");

Answer 2

Try this:

$(".modal").hide();

If it's a bootstrap modal, then perhaps this'll work:

$(".modal").modal("hide");

And to check if your checkbox is checked or not, try this:

$(".modal-state").is(":checked") ? $(".modal").hide(): $(".modal").show();