How to close dialog after popup in JQM?

Question

I am loading one page via jQuery Mobile dialog widget and if i use popup messages in loaded page i cant close it after popup on ios 6.1.2. Here is an example:

jQuery.post(
    ajax_url+'create',
    {'info': send_values},
    function(result){
        if(result.status){
            //Without this message all works fine
            jQuery('#popup-message').text(result.message).popup('open');
            setTimeout(function(){
                // Tried
                // jQuery('#popup-error').popup('close');
                // jQuery('#popup-message').popup('close');
                // jQuery('.ui-dialog').dialog('close');
                jQuery('#dialog').dialog('close'); //loaded div is with dialog id
            }, 2000);
        }
        else
            showError(result.message);
    },
    'JSON'
)

You'd close it with the same ID and method that you used to open it: jQuery('#popup-message').popup('close'); — isherwood, Mar 17 '13 at 15:47
In general, I would avoid using modals and popups on a mobile platform. It can make for a poor user experience. With that said, see this thread: http://stackoverflow.com/questions/12855123/ios-6-js-events-function-not-called-if-has-settimeout-in-it — Jacob VanScoy, Mar 17 '13 at 15:47
@isherwood i'm opening and closing it with the same id as opened, as you mentioned. — user1692333, Mar 17 '13 at 16:02
Yes, but you're inexplicably trying to do it with dialog() in your code above. I understand desperation, but that's clearly not right. :-) — isherwood, Mar 17 '13 at 20:51

Red2678 · Answer 1 · 2013-03-18T03:00:02.793

EDIT:

The question is how to close a dialog after being opened from within a popup

Ok, now I got it ;)

So there is a event you can listen for that is called after a popup is opened

$( ".Selector" ).on( "popupafteropen", function( event, ui ) {} );

src:http://api.jquerymobile.com/popup/#event-afteropen

So your code updated should be:

jQuery.post(
ajax_url+'create',
{'info': send_values},
function(result){
    if(result.status){
        //Without this message all works fine
        jQuery('#popup-message').text(result.message).popup('open');
        jQuery('#popup-message').on('popupafteropen', function( event, ui ) {
            setTimeout(function(){
                // Tried
                // jQuery('#popup-error').popup('close');
                // jQuery('#popup-message').popup('close');
                // jQuery('.ui-dialog').dialog('close');
                jQuery('#dialog').dialog('close'); //loaded div is with dialog id
            }, 2000);
        } );
    }
    else
        showError(result.message);
},
'JSON'
)

Original Answer:

You are trying to close a DIALOG...however you opened a POP-UP.

Change:

 jQuery('#dialog').dialog('close'); //loaded div is with dialog id

To:

 jQuery('#dialog').popup('close'); //loaded div is with dialog id

src: http://api.jquerymobile.com/popup/#method-close

My question is: How to close `dialog after popup`! – user1692333 Mar 17 '13 at 21:06 — user1692333, Mar 17 '13 at 21:06
Updated my answer, hope that helps! :) – Red2678 Mar 18 '13 at 03:00 — Red2678, Mar 18 '13 at 03:00

How to close dialog after popup in JQM?

1 Answers1