Dialog _ jQuerymobile

Question

I want to open the dialog box based on the Ajax result. How to create/open the dialog from the .js file?

Anyone help me.

THanks in advance.

Answer 1

if you just link to a file like this:

<a href="foo.html" data-rel="dialog">Open dialog</a>

it's done with AJAX anyway and degrades nicely for people with lesser JS support.

The way you want to do it:

Create a wrapping div for your content and give it a data-role=dialog attribute, then call .dialog() on it, or .page() if dialog doesn't work. update: With JQMbeta2 they introduces a 'create' event which you have to trigger it on stuff instead of using .page

Answer 2

Don't know if this post is still relevant, but I did it like this:

function openDialog(strPageId, strTransition){
    $.mobile.changePage($("#"+strPageId+":jqmData(role='dialog')"), {transition : ""+strTransition+""});    
}

And then you can invoke it on a button, or in your code, wherever...

<button data-theme="a" name="btnOS" id="btnOS" onClick="openDialog('pu-edit-mailorder','slideup')">Order</button>

Answer 3

I think he means he wants to use JS to open a jQM dialog, not create a dialog link and fire a click event.

If so you're supposed to use $.mobile.changePage('pageURL', {role: 'dialog'});

Answer 4

.dialog() for some reason did not work for me. I am using:

$("<a href='#dialog-id' data-rel='dialog'></a>").click().remove();

Not really nice, but works.