That's because when pageinit
is fired, the poupup isnt ready for manipulation just yet. You need to use pageshow
to get the popup to open. Here's what you do :
- Make the ajax call in
pageinit
. store the data indata
attribute of the page. - Then, in the pageshow event, take if from data and manipulate it the way you want, then open the popup.
Here's the 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");
And here's a demo : http://jsfiddle.net/hungerpain/MvwBU/