How to try to close the popup by pressing a button after executing any code?

Question

I try to make a button that is going to do something and close the popup (the button is in the popup, I use jquery mobile)

<div class="ui-block-b"> <a href="#popupDialog" data-rel="popup" data-position-to="window" data-role="button" data-inline="true" data-transition="pop">Feedback</a> </div> <div data-role="popup" id="popupDialog" data-theme="c"> <div data-role="header" data-theme="a" class="ui-corner-top"> <h1>Feedback</h1> </div> <div data-role="content" data-theme="d" class="ui-corner-bottom ui-content"> <h3 class="ui-title">Thank you for your participation!</h3> <p>Some content</p> <a href="#" data-role="button" data-inline="true" data-rel="back" data-transition="flow" data-theme="b">Cancel</a> <input type="button" id="feedback_send" value="Send" data-inline="true" data-theme="b"> </div> </div> 

When I click the button, I would like to send data to the server and close the pop-up window (I connect the send to a function that sends data to the server, but I do not know how to close the pop-up after), I tried to emulate the cancellation of the click, but this is not closes.

Answer 1

The popup can be closed as follows:

 $( ".selector" ).popup( "close" ); 

But in your case, you should use it as follows:

 setTimeout(function(){ $( ".selector" ).popup( "close" ); },1); 

setTimeout is necessary because the web kit browser cannot close the popup without a slight delay.

Working example: http://jsfiddle.net/Gajotres/B6TgZ/

 $(document).on('pagebeforeshow', '#index', function(){ $(document).on('click', '#feedback_send', function(){ setTimeout(function(){ $( "#popupDialog" ).popup( "close" ); },1); }); }); 

Before closing the popup, do everything you need to do. There is also another approach, you can always close your popup and call popupafterclose to complete all that needs to be done.

 $( "#popupDialog" ).on( "popupafterclose", function( event, ui ) { // Do something here, it requires SOlution 1 to trigger popup close alert('Popup closed'); }); 

Of course, this solution still requires a button to launch the pop-up closure function. But unlike solution 1, this will not lead to a small delay (delay = action, which you will do before the pop-up window is closed) until the pop-up window closes.

Answer 2

This worked for me to put data-rel = "back" in the button, since I caught the click with another click function. This way you can call your function and close the popup.