5

私の Web ページには、jQuery UI ダイアログがあります。ボタン（新しいユーザーの作成）をクリックすると、新しいウィンドウが開きます。私の質問は、AJAX リクエストでそのウィンドウを開くにはどうすればよいですか?

別のページからダイアログ フォームを開くとよいでしょう。例えば：dialog.html

<div id="dialog-form" title="Create new user">
  <p class="validateTips">All form fields are required.</p>

  <form>
  <fieldset>
    <label for="name">Name</label>
    <input type="text" name="name" id="name" class="text ui-widget-content ui-corner-all" />
    <label for="email">Email</label>
    <input type="text" name="email" id="email" value="" class="text ui-widget-content ui-corner-all" />
    <label for="password">Password</label>
    <input type="password" name="password" id="password" value="" class="text ui-widget-content ui-corner-all" />
  </fieldset>
  </form>
</div>

このフィドルで完全なコードを見ることができます：

4

3 に答える 3

10

次のようにダイアログを定義できます。

function showUrlInDialog(url){
  $.ajax({
    url: 'dialog.html',
    success: function(data) {
      $("#dialog-form").load(data).dialog({modal:true}).dialog('open');
    }
  });
}

そして、dialog-form div 内にある現在のマークアップを、dialog.html という新しいページに定義します。ボタンクリックイベントで上記の関数を呼び出します。これがあなたが必要としていたものであることを願っています。

于 2013-10-09T09:16:57.590 に答える
6

これは答えのより単純なバージョンだと思います：

$("#the-button").click(function(){
  $("#dialog").dialog({modal: true}).dialog('open')).load("dialog.html")
})
于 2014-09-25T20:27:31.927 に答える
0

私にとって.loadは機能していません。だから私は使った、

function showUrlInDialog(url){
  $.ajax({
    url: 'dialog.html',
    success: function(data) {
      $("#dialog-form").html(data).dialog({modal:true}).dialog('open');
    }
  });
}
于 2015-12-26T07:58:43.057 に答える