jQuery Mobile Popup öffnet nicht auf .popup ('open')

Question

Ich versuche, jQuery Mobile 1.3.1 Popup zu verwenden, um den Benutzer zu warnen, wenn die Anmeldedaten falsch sind. Ich habe mit einer Basisvorlage aus der Dokumentation von jquerymobile begonnen, aber ich konnte es nicht mit $('#popupBasic').popup('open'); arbeiten lassen, wenn ich es so benutze;

 <div data-role="page"> 


     <div data-role="header" data-tap-toggle="false"> 
     </div><!-- /header --> 

     <div data-role="content"> 

      <a href="#popupBasic" data-rel="popup">Tooltip</a> 
      <div data-role="popup" id="popupBasic">I will change this text dynamically if this popup works</div> 


     </div><!-- /content --> 
    </div><!-- /page --> 

Es funktioniert gut, wenn ich auf den Tooltip-Link klicke. Aber in meinem Fall gibt es kein Klicken, also versuche ich es;

   if(retVal){ 
        $.mobile.changePage('index'); 
       } 
       else{      
        $('#popupBasic').popup(); 
        $('#popupBasic').popup("open"); 
       } 

dies ist nach meiner Ajax-Login-Funktion einen Rückruf macht, so retVal wahr ist, wenn es keine Fehler, falsch ist, wenn es (und an diesem Punkt Ich versuche Popup zu zeigen). By the way alle meine js part ist in

$(document).on('pageinit', function(){}); 

so warte ich bis jquerymobile ist bereit für die Seite.

Was passiert, wenn ich dies tun, ist auf Desktop-Browsern Änderungen Link als

http://localhost/login#&ui-state=dialog 

aber zeigt nicht die Pop-up. Nach einigen Aktualisierungen und Caches beginnt es sich zu zeigen. Auf iOS passiert das gleiche auch, aber auf Android ändert sich manchmal die Verbindung, manchmal nicht.

Ich wäre wirklich glücklich, wenn mir jemand helfen könnte, dieses Problem zu lösen. Vielen Dank im Voraus.

Answer 1

Das ist, weil, wenn pageinit ausgelöst wird, der Poupup ist noch nicht bereit für die Manipulation nur noch. Sie müssen pageshow verwenden, um das Popup zu öffnen. Hier ist, was Sie tun:

• Machen Sie den Ajax Anruf in pageinit. Speichern Sie die Daten in data Attribut der Seite.
• Dann, in der pageshow-Ereignis, nehmen Sie, wenn aus Daten und manipulieren Sie es wie Sie wollen, dann öffnen Sie das Popup.

Hier ist der Code:

$(document).on({ 
    "pageinit": function() { 
     alert("pageinit"); 
     //$("#popupBasic").popup('open'); will throw error here because the page is not ready yet 
     //simulate ajax call here 
     //data recieved from ajax - might be an array, anything 
     var a = Math.random(); 
     //use this to transfer data betwene events 
     $(this).data("fromAjax", a); 
    }, 
    //open popup here 
    "pageshow": function() { 
     alert("pageshow"); 
     //using stored data in popup 
     $("#popupBasic p").html("Random : " + $(this).data("fromAjax")); 
     //open popup 
     $("#popupBasic").popup('open'); 
    } 
}, "#page1"); 

Und hier ist ein Demo: http://jsfiddle.net/hungerpain/MvwBU/