jquery - jquerysimplemodal別のsimplemodalを呼び出す

Question

既存のモーダルのリンクから別のシンプルモーダルを呼び出したい。

私はOSXモーダルを使用しています。

これどうやってするの ？

Answer 1

SimpleModalは、一度に1つのモーダルオープンのみをサポートします。

新しいコンテンツを開く代わりに、必要なコンテンツを取得して、既存のコンテンツをそれに置き換えることができます。

Answer 2

$('#myModal').modal.update();

代わりに、$.modal.update();モーダルダイアログは1つしかないので、どれを指定する必要はないと思います。

Answer 3

それを達成する方法は多すぎます。そのうちの1つを紹介します。

a）IDが「myDisplay」のdivを「simpleModal-ing」しているとしましょう。

<div id='myDisplay' style='.........'></div>

b）まず、そのページ（div）にフォームのコンテンツをロードしました

<div id='myDisplay' style='.........'>
 <form ............>
  <input this>
  <input that>
  <submit onClick='updateMyDisplay'>
 </form>
</div>

c）ページの中間のどこかに、更新スクリプトを配置します。

<script type='text/javascript'>  //remember that you could/should have only one of this
   function updateMyDisplay() {
      //plain html/javascript
      document.getElementById('myDisplay').innerHTML="Thank you!";
      .. or ..
      //jquery
      $('#myDisplay').html("Thank you!");
   }
</script> //again : could/should have only one of this

......そのようなもの（単一のモーダルを持つ複数のディスプレイ）を実装する最良の方法は、jQuery load（）を使用することです。

メインページまたはスクリプトのページで、空の非表示のdivを作成します。

<div id='myModal' style='......; overflow:auto; display:none; ' ></div>

次に、そのdivにオフライン（同じページのコンテンツ以外）のhtmlページを入力します

フォーム.......myForm.htmlファイルのthanking...thankyou.htmlファイル

jqueryを使用する（私にとって最も簡単なこと）：

 .......
  $('#myModal').load('myForm.html');
  $('#myModal').height('650px');
  $('#myModal').modal();
 .......
  // on completion of the form:
  $('#myModal').load('thankyou.html');
  $('#myModal').modal.update(); // (Eric Martin, himself, sent me this tip through Twitter)
 .......

とにかく、あなたが「コードの借り手」であるなら...私のように、あなたは上記を理解するのに苦労するかもしれませんが、いずれにせよ、私があなたを助けたことを願っています。