0

マイクロポスト/メッセージングシステムがあり、新しいマイクロポストまたはコメント/メッセージが送信されるたびに、ページが更新されて表示されます。

：remote => trueを使用してフォームにajaxを設定したので、マイクロポストを作成するか、ページを更新せずに追加したいと思います。

これまでのところ：

class MicropostsController < ApplicationController

def create

    if params[:micropost][:user_id].to_i == current_user.id

     @comment = Comment.new(:user_id => current_user.id)
        respond_to do |format|
            if @micropost.save

            format.js   { render :post_on_wall }
            else
            format.js   { render :form_errors }

            end
        end
    else

フォームがすべての検証に合格し、ユーザーがpostをクリックする前に実際に有効なものを入力した場合、「if @ micropost.save」がtrueになり、「post_on_wall」という名前のファイル内でjsが実行されます。「@micropost.save」の場合、「form_errors」内のコードが実行されます。

form_errors内に、ユーザーが何も入力せずに投稿をクリックしたときにマイクロポストが投稿されないことを確認するためのアラートを追加しました。正常に動作します。

「post_on_wall」ファイルには次のようなものがあります。

$('.microposts').prepend('<%= j render("users/partials/microposts") %>');

これに伴う問題は、基本的に、「users / components / microposts 」とレンダリングされるファイルでループされているすべてのマイクロポストを取得し、「。microposts」div内のすべての上に配置することです。「.microposts」の上部にあるマイクロポストを投稿する実際のフォームでさえ、ページに追加されたばかりのコンテンツの下に押し下げられます。この場合、ページ付けを使用しており、per_pageを10に設定しているため、10スペース下に配置します。

これが私のhtml構造です。

<div class='cf' id='content'>
    <div id='leftColumn'>
    </div>
    <div class='microposts'>
    </div>
    <div id='rightColumn'>
  </div>
</div>

各マイクロポストとそれに関連するコメントは、「。postHolder」というクラス内に保存されます。

私はこれについて間違った方向に進んでいると感じています。this： "users / components / microposts"が指すファイルには、基本的に、一度に複数のマイクロポストを表示するのに役立つコードが含まれています（10）。これは、私がやろうとしていることとはまったく異なる何かに使用されます（ページ付け+無限スクロール）。

とにかく、私がこれに取り組むべき方法は、投稿されたばかりの新しい投稿を何らかの方法で検出することだと感じています。新しい「.postHolder」クラスとして検出され、検出された後、「postHolder」のリストの一番上に追加され、その上のマイクロポストフォームが置き換えられないようにする必要があります。

すべてのマイクロポストを保持するために別のdivを作成し、このdivをマイクロポストフォームの下に配置することを考えています。そうすれば、フォームが押し下げられることを心配する必要はありません。実際に私が前に付けるものになるすべてのマイクロポストが含まれています。

これでも、投稿されたばかりの投稿を取得して、リストの一番上に追加するという問題が残ります。

とにかく、私はこの機能を実装するのに役立つ例やいくつかの良いアドバイスが本当に欲しいです。

お時間をいただきありがとうございます。

4

1 に答える 1

0

現在のHTML/部分構造では、代わりにこれを実行してください（部分的に作成されるので、マイクロポスト全体を置き換えてください）。

$('.microposts').html('<%= escape_javascript render("users/partials/microposts") %>');

ただし、将来的には、マイクロポストをレンダリングする_micropostパーシャルを作成すると、.micropostの上部にマイクロポストだけを簡単に追加できるようになります。

于 2012-04-09T19:52:31.193 に答える