1

アプリケーション内の多くの Rails ビューは、AJAX を介してデータを取り込みます。それらのデータの最初のレンダリングは、jquery の$(document.ready)イベントで実行される JavaScript 呼び出しから行われます。このために必要なビューは、基本的に表形式のデータのリストを表示します (受信トレイ、検索結果のリストなど)。

AJAX 呼び出しを行うことなく、結果の最初のページを事前にレンダリングしたいのですが、ページ全体をリロードせずにビューを再設定できるようにしたいと考えています。これは難しいことではありませんが、同じことを行うアプリのさまざまな部分に個別のコードを記述する必要があるようです: ビューで 1 回 (最初のrender呼び出しから) データの初期セットを描画し、もう一度新しいデータ セットを描画する Javascript (古い DOM を動的に消去し、新しい HTML に置き換える)。

現在、javascript は非表示の ( を使用してstyle='display: none') テンプレート要素 (通常はdiv) を複製し、各フィールドの値を設定し、新しい要素を DOM に追加します。これはうまく機能しますが、レンダリングする前にビューを事前設定したい場合は、テンプレート オブジェクトの別のコピーを ruby​​ 化された ERB ブロック (例: @messages.each do |m|) に書き込む必要があります。テンプレートが変更された場合、ERB ブロック内のコードを一致するように変更する必要があります。あまり DRYではありません。

より良い方法はありますか？もしそうなら、それは何ですか？

ありがとう

トム

4

1 に答える 1

1

ドキュメント（準備完了）では、イベントハンドラーに関連付けられていない最初のAJAX呼び出しを明示的に行うことができます。または、同様に、イベントハンドラーを明示的にトリガーできます。

初期化されていないインデックスビュー：

index.html.haml（初期）

.span12
  #book-table

これが、データの入力に使用されるDRYedupパーシャルです。div#book-table

_table.html.haml

%table
  %tr
    %th Title
    %th Author
  - books.each do |book|
    %tr
      %td= link_to book.title, book_path(book)
      %td= book.author

次に、それに応答するJSがあります。これが行っているのは、インデックスアクションへのAJAX呼び出し中にパーシャルをレンダリングしていることに注意してください。

index.js.erb

$('#book-table').html('<%= escape_javascript(render(partial: "table", locals: { books: @books })) %>');

次に、インデックスビューを調整して、このビューに初期化する必要があります。

index.html.haml（最終）

:javascript
  $(document).ready (function() {
    $.get("/books.js");
  });

.span12
  #book-table

ご覧のとおり、document.readyは最初のAJAX呼び出しを実行し、.js.erbをヒットして、.html.hamlにdivを明示的に入力せずにdivを入力します。

于 2012-05-12T18:10:58.243 に答える