jQuery Mobileモーダルダイアログを閉じてオーバーレイする方法は？

Question

私は次のようにアヤックスとjqueryの携帯アルファ4を経由してダイアログボックスを表示：大成功コールバック内

：上記のコード

success: 
$j('#wchkdiv').html(msg); 
$j("#wchkdiv").dialog(); 
$.mobile.changePage($('#wchkdiv'), 'pop', false, true); 

は、HTMLページ内の一部のテキストがあるとダイアログがうまく、その外観に遷移させます（アンカータグではなく）クリックして、javascriptがクリックイベントをバインドします。私のようなコードを持っているダイアログ内の今

：

<form id="gform" name="gform" class="formbody" method="post"> 
<input class="btns" type="button" onclick="return wchkSubmit(event,'tryAgain');" 
    name="tryAgain" value="Try Again"/> 
</form> 

もう一度試してみてくださいボタンをクリックすると、私はダイアログクローズを作るべきジャバスクリプトを経由して、これを処理しなければならないが（他のものの間でそれを行う必要がある）、およびダイアログが表示される前に表示されていたコンテンツページが再び表示されます。つまり、ページの再読み込みが発生してはならず、ダイアログボックスは閲覧履歴の一部であってはならないということです。

jquery mobile Dialogをhtmlページの上にオーバーレイする画面の一部に表示する方法を私に示すことができれば、それはもう一つの大きなプラスになるでしょう。現在、ダイアログは画面全体を占めています。

Answer 1

ライブ例：http://jsfiddle.net/ReMZ6/4/

HTML

<div data-role="page" data-theme="c" id="page1"> 
    <div data-role="content"> 
     <p>This is Page 1</p> 
     <button type="submit" data-theme="a" name="submit" value="submit-value" id="submit-button-1">Open Dialog</button> 
    </div> 
</div> 

<div data-role="page" data-theme="a" id="page2"> 
    <div data-role="content"> 
     <p>This is Page 2</p> 
     <button type="submit" data-theme="e" name="submit" value="submit-value" id="submit-button-2">Close Dialog</button> 
    </div> 
</div> 

JS

$('#submit-button-1').click(function() { 
    $.mobile.changePage($('#page2'), 'pop', false, true); 
}); 

$('#submit-button-2').click(function() { 
    alert('Going back to Page 1'); 
    $.mobile.changePage($('#page1'), 'pop', false, true); 
}); 

Answer 2

私は、私は完全にあなたがやろうとしているものをフォロー、しかし、javascriptを経由してダイアログを閉じるには、あなたが必要なすべての呼び出しである正ませんよ。上のダイアログポップアップを作るためのよう

$j("#wchkdiv").dialog('close'); 

同じ "ページ"、私はあなたがjQM選択リストの動作を参照していると思いますか？もしそうなら、私の知る限り、それは不可能です。その目的のために、私は実際に自分のバージョンのダイアログを書きました。デモはここにあります：http://dev.jtsage.com/jQM-SimpleDialog/

私が完全に逃した場合は、私が知っていると私はいくつかの洞察力を追加することができますが表示されます。

Answer 3

あなたが探しているものに最も近いものは、おそらくjtsageのjqueryのモバイル-simpledialog

です

http://dev.jtsage.com/#/jQM-SimpleDialog/

HTML：

<p>You have entered: <span id="dialogoutput"></span></p> 
<a href="#" id="dialoglink" data-role="button">Open Dialog</a> 

はJavaScript：

$('#dialoglink').live('vclick', function() { 
    $(this).simpledialog({ 
    'mode' : 'string', 
    'prompt' : 'What do you say?', 
    'buttons' : { 
     'OK': { 
     click: function() { 
      $('#dialogoutput').text($('#dialoglink').attr('data-string')); 
     } 
     }, 
     'Cancel': { 
     click: function() { return false; }, 
     icon: "delete", 
     theme: "c" 
     } 
    } 
    }) 
}) 

Answer 4

私は$('.ui-dialog').dialog('close');作品はJSを通じて対話を閉じることがわかりました。

そして、$.mobile.changePage('#pageID', {transition: 'pop', role: 'dialog'});にPOPダイアログを表示します。