Question

I am building a webapp with jquery mobile. I want to do a basic popup like is shown over here.

But it is not working and it is also displaying the text on the screen.
Here is my HTML:

<div data-role="popup" id="basic" data-transition="pop">
    <p>I am a default popup</p>
</div>

And I have called it like this.

if (zalen.length > 0) {   
    $('#basic').popup();     
} else {
    $('#basic').popup();    
}               

Can anybody help?

Answer 1

You didn’t follow the documentation correctly:

1) The link that opens the popup should have the attribute data-rel="popup", and href="#somePopup".

2) The popup content should have the attribute data-role="popup" along with the ID you specified in the href attribute for the link. (id="somePopup" for the element containing the popup content)

3) Then you can call it programmatically like you suggested, $("#somePopup").popup();

Edit: Aside from this problem that was fixed, it seems like @SySammy is correct; the popup widget is still in development and is not in the current release version.