3

私の問題は、ナビゲーション リンク/エンドレス スクロールに関係しています。

各マイクロポストに「削除」ボタンを追加しました。そのボタンが押されると、サーバーへの ajax 呼び出しが行われ、マイクロポストが削除され、div が DOM から削除されます。

最初のページにマイクロポスト 1 から 10、2 番目にマイクロポスト 11 から 20 などがあるとします。最初のページの項目 1、2、3 を削除するとします。次に、下にスクロールします。サーバーはマイクロポストを「再計算」します。前のリストの 3 つを削除したので、アイテム 13 から 22 が返されます。つまり、マイクロポスト 10、11、12 は最初のページにも 2 番目のページにも表示されません。

stackoverflow を探し回った後、解決策を見つけました。

リストからマイクロポストを削除するときはいつでも、ページの最後のマイクロポストの直後にあるマイクロポストを読み込み、一番下に挿入します。

私が現在どのように修正を行っているか:

デフォルトでは、will_paginate gem を使用して 1 ページに 10 個のマイクロポストを表示します。いつでも表示されるマイクロポストの ID を知る必要があります。これは、各マイクロポストを保持するコンテナーの開始 div タグに格納することで実現します。

<% @microposts.each do |m| %>
     <div class="postHolder" data-micropost-id="<%= m.id %>">

microposts.js アセット ファイルで次のようにアクセスします。

$(function() {

     $('.message_delete').on('ajax:success', function(event, data, status, xhr){
          console.log(data); //to check if json is working
          console.log($('.postHolder').last().data('micropost-id'));
     });
});

これが私のコントローラーの破棄アクションです。

def destroy
    micropost = Micropost.find(params[:id])
       respond_to do |format|   
         micropost.destroy
       format.json  { render :json => micropost } #just to check if json is working
    end
end

これで、各マイクロポストの ID がわかったので、1 つが削除されたら、jquery セレクターを使用して、ページの最後の .postHolder div を細かく指定し、その ID を使用して、その後に続くマイクロポストを取得し、そのマイクロポストをその後に挿入します。 . このようにして、メッセージが削除されると、メッセージが自動的に追加されます。

ユーザーがたまたまスクロールしてさらにメッセージをロードした場合、欠落しているものはありません。私はいくつかのRailscastを見て、Ryan Batesがデータ属性を使用して同様のことを行っているのを見て、それらについていくつか読んだところ、これは悪い習慣であるという印象を受けたようです.

私はこれを行う他の方法を考え出そうとしましたが、何も思いつきませんが、この方法で行うのは少し奇妙に感じます. たぶんそれはすべて私の頭の中ですが、可能であれば別のより良い解決策が欲しいです。

ありがとう

敬具

4

1 に答える 1

1

変数を使用して、現在のページのマイクロポストの数を追跡できます。投稿を削除するたびに、この変数をデクリメントしてください。投稿の新しいページをフェッチするたびに、この変数をデフォルト値(10)にリセットします。

新しい10件の投稿を取得すると、データベースのオフセットは次のようになります(マイクロ投稿のリクエストページ3で、2ページから4ページを削除したと仮定します)

(3 * 10) - (4) == 26

3ページの最初のマイクロポストはマイクロポストID26になります

私があなたの質問を理解したと仮定すると、それはです!

于 2012-05-23T09:26:10.433 に答える