1

私が現在理解しているように、jquery モーダルはページの読み込み中にレンダリングされ、hidden= true から hidden=false の値を介してユーザーによってトリガーされます。

これはすべてうまく機能し、モーダルがページごとに最小限に抑えられている場合にうまく機能します。しかし、これが私の質問です。モーダルの完全なリストがあり、それをクリックすると、編集する情報のモーダルがポップアップ表示される場合はどうでしょうか。たとえば、ドキュメントのグリッドがあり、ドキュメントをクリックするとモーダル ポップアップが表示され、小さなドキュメントを編集することができます。ページの読み込み中にこれらすべてのドキュメントをレンダリングしないと、ユーザー エクスペリエンスが遅くなります。そのモーダルを「オンデマンド」でロードしてレンダリングする方法はありませんか。

このタイプの動作の標準的な方法は何ですか。

ドキュメントごとに新しいページをロードするレールの方法は知っていますが、これをどのように機能させることができるか非常に興味があります。

このライブラリは私が最もよく知っているライブラリであるため、jQuery クラウドにもタグを付けました。

4

2 に答える 2

1

私は自分のアプリでこれをよく行います。これは、私のアプリの 1 つにあるフィードバック ボタンのコードです。

ダイアログが作成され、ボタンが押されると、ダイアログのコンテンツが動的に読み込まれます。 

$(function () {
    var button= $("#FeedbackButton");
    if (button.length == 0)
        button= $("<div id='FeedbackButton'>Feedback</div>").hide().appendTo("body");


    var dialog = $("#FeedbackDialog");
    if (dialog.length == 0)
        dialog = $("<div id='FeedbackDialog'>Feedback</div>").hide().appendTo("body");

    button.click(function () {
        button.hide();
        dialog.load("_FeedbackDialog.htm");
        $(dialog).dialog({
            title: "Feedback",
            modal: true,
            width: 800,
            height: 300,
            close: function () {
                $(button).show();
            }
        });
    });
});
于 2012-05-31T14:19:51.560 に答える
1

オンデマンドでモーダルをレンダリングするということは、AJAX クエリに応答することを意味していると思います。その場合、はい、オンデマンドでモーダルを構築する方法があります。あなたがしなければならないことは、コントローラーへの AJAX 呼び出しを行うイベント リスナーをセットアップすることです。

# my_view.html
/* inside JS event trigger */
$.get("/get_modal.js")

次に、コントローラーで、その AJAX 呼び出しに応答します。

# my_controller.rb
def get_modal
  respond_to do |format|
    format.js # this will execute get_modal.js (or get_modal.js.erb)
  end
end

ただし、「ビュー」は HTML ではなく、自由に実行できる JS になります。

# get_modal.js
/* JS modal code */
于 2012-05-31T18:23:52.350 に答える