2009-08-08 31 views
1

私はこのコードを使用して、私のアプリケーションでSimplemodalを実装しています:SimplemodalのAJAX呼び出し

$(".dialog-link").live('click', function(e) { 
e.preventDefault(); 
$.get($(this).attr('href'),function(data) { 
    $.modal(data, {onOpen: open, position: ['10%','30%']}); 
); 
}); 

(FYI:開く時のコールバックは、単にいくつかの高さを設定)

AJAX呼び出しによって返された文書(データに含まれている)は、 datepickerなどのjquery呼び出しを持っています。しかし、私のダイアログに datepickerが表示されても動作しません。

私はonshowコールバックからdatepickerを開くことができますが、各ダイアログに異なるjquery呼び出しがある可能性があるため、データに含まれる関数を呼び出すのが理想的です。

例えば

onShow: function(dialog) { dialog.data.my_function(); } 

おかげで、明らかにすることができるDOM検査として マイケル

答えて

1

(放火魔が...常に便利です)、モーダルダイアログの負荷外部ドキュメントを行う方法はありますdivに、<html>タグと<head>タグを取り除く。また、ロードされたドキュメントで定義されたメインウィンドウのオブジェクトと関数のスコープにインポートするように見えます。

したがって、別のウィンドウまたはフレーム(dialog.data.my_function)のスコープ内にあるかのように関数を呼び出すことはできません。

代わりに、私の代わりに、外部関数をonShowイベントに直接バインドしてください。

メイン文書:

<script type="text/javascript"> 
     $("a.dialog-link").live('click', function(e) { 
      e.preventDefault(); 
      $.get($(this).attr('href'),function(data) { 
      $.modal(data, {position: ['10%','30%'], onShow: function(dialog){ 
                  external_function() 
      }}); 
     }); 
    </script> 

外部文書(モーダルボックスにロードされた:)

<html><head><title>bla bla </title> 
    <script type="text/javascript"> 
     function external_function(){$("#external_content").text("UPDATED!")}; 
    </script> 
</head> 
<body> 
<div id="external_content"> .... </div> 
</body> 
</html> 

・ホープ、このことができます:) @Andの答えに拡大

1

を。 live()はjQuery 1.9で削除されているので、

$(document).on("click","a.dialog-link",function(e) { 
    e.preventDefault(); 
    $.get($(this).attr("href"),function(data) { 
     $.modal(data, {position: ["10%','30%"], onShow: function(dialog){ 
      external_function() 
     }}); 
    }); 
});