2011-08-15 3 views
-1

ボタンが1つあり、ユーザーがクリックするとデータ(サーバー側からHTML要素のように)を取得したいとします。たとえば:プログラムでThickBoxを使用したい

<table><tr><td>here is my content</td></tr></table> 

私はAjax呼び出しを使用してサーバからの全体のHTMLを取得します、と私はThickBoxの内部にそれを示したいと思います。私はthickboxサイトを通過し、インラインコンテンツデモのために以下のコードを見つけました...しかし、私はそれがそのように動作することを望んでいません。

<input alt="#TB_inline?height=300&width=400&inlineId=myOnPageContent" title="add a caption to title attribute/or leave blank" class="thickbox" type="button" value="Show" /> 
<a href="#TB_inline?height=155&width=300&inlineId=hiddenModalContent&modal=true" class="thickbox">Show hidden modal content.</a> 

代わりに、プログラムでthickboxを表示したいとします。 thickboxが表示されると、太いボックス内でビジーなアニメーションが再生され、ajaxコールが完了し、データが利用可能になると、取得したデータをthickboxの内部に表示します。だから小さなコードでこれを行う方法を教えてください。

答えて

1

この機能は、uは何ができるかThickBoxの

OR

の「AJAXコンテンツ」セクションを確認がすでにあるリンク/ボタンを たときにユーザーがクリックは、サーバー側の関数を呼び出して変更することです'hiddenModalContent'の内部HTMLコンテンツ

<script type="text/javascript"> 
     function GetAjaxData(){ 
       //retrieve ajax html data here 
       return "<b>Ajax data</b>"; 
     } 

     $(document).ready(function(){ 
       $("#myLink").click(function(){ 
        var AjaxContent = GetAjaxData(); 
        $("#hiddenModalContent").html(AjaxContent); 
       }); 
     }); 
</script> 

<input alt="#TB_inline?height=300&width=400&inlineId=myOnPageContent" title="add a caption to title attribute/or leave blank" class="thickbox" type="button" value="Show" /> 
<a href="#TB_inline?height=155&width=300&inlineId=hiddenModalContent&modal=true" class="thickbox" id="myLink">Show hidden modal content.</a> 

<div style="display:none" id="hiddenModalContent"> 
</div> 
関連する問題