2011-07-18 15 views
0

私はRailsアプリケーションを持っています。私はページ上に複数の行のデータを表示します。各行について、その行のポップアップに余分なデータを表示するボタンを作成したいとします。私はそれぞれの隠されたデータを望んでいない私はAjaxコンテンツを含むjQueryポップアップ

  1. のjQuery UIのダイアログ(http://jqueryui.com/demos/dialog/

    • Ajaxのクエリでデータを取得するためのオプションを与えるものではありません、
    • 以下のチェックを

  2. jQPOOOP jQueryプラグイン http://plugins.jquery.com/project/jQPOOOP

    • 私はJSONデータに

を働くことが何かをしたい、HTMLデータ上の作品のように見えるいかなるだけjqueryのUIダイアログを使用して何かを構築する方法が、JSONの仕事がありますajaxリクエストから取得したデータ?

答えて

3

はい、ダイアログがjsonデータを消費できるとは思わないようにしてください。これを行う:

  1. 火災あなたのAjax
  2. をあなたのハンドラで準備し、あなたがしたい場合は、ダイアログの火よりAJAXをボタンのハンドラでダイアログ
  3. を明らかにし、その結果を処理します。

重要な点は、jQuery UI Webサイトに表示されている例とは異なるダイアログを考えることです。 JSONの戻り値を参照してダイアログを動的に生成し、jQueryセレクターを使用して必要なものを見つけ出し、さらに作成し、ダイアログコンテンツに新しい要素を挿入します。ここで

は、より具体的な例である:

$("#dialog").dialog({ 
modal: true, 
buttons: { 
     Ok: function() { 
     fire_ok_ajax_with_handler(); //pretend the handler is ok_handler 

    } 
    } 
}); 


// this method is called when the action the user takes wants to 
// open the dialog. Note that it doesn't actually open the dialog 
// but instead starts the ajax process of getting the data it needs 
// to prepare the dialog 
$("#opener").click(function() { 
    $("#dialog").dialog("open"); 
    fire_ajax_to_start_stuff(); 
    return false; 
}); 

function fire_ajax_to_start_stuff(...) { 
    // assume start_handler method 
} 

function start_handler(data) { 
    //process data, which can be json if your controller formats it that way 
    // use the data to dynamically setup the dialog, 
    // show the dialog 
    $("#dialog").dialog("open"); 
} 

function fire_ok_ajax_with_handler() { 
    // this is where you set up the ajax request for the OK button 
} 

function ok_handler(data) { 
    // handle possible errors messages 
    // close the dialog 
    $(this).dialog("close"); 
} 

がその例で手を振って擬似コード/手のLOTがあるが、それはあなたの基本的なアプローチを与えるべきであることに注意してください。

+0

これを少しきれいにしました。 – jaydel

+0

私はそれを試してみましょうあなたに知らせる – rangalo

+0

こんにちは、アプローチは、ありがとう、ありがとう。 – rangalo

関連する問題