0

したがって、私が抱えている問題は、RubyonRailsアプリで「いいね」/「嫌い」ボタンをajaxで更新することです。コードは次のとおりです。

app / views / _comment.html.haml

- likes = comment.likes
%div.comment{id: "comment-#{comment.id}"}
  .comment-avatar
    .medium-user-avatar.avatar-canvas
      - if comment.user.avatar_url
        = image_tag comment.user.avatar_url(:medium)
      - else
        %span.medium-user-initials.initials-decoration
          = comment.user.avatar_initials
  %span.comment-username= link_to(comment.user_name, "#")
  %span.comment-body~ markdown(comment.body)
  .comment-time
    = time_ago_in_words(comment.created_at) + " ago"
    - if can? :like, comment
      = " · "
      - if likes.find_by_user_id(current_user.id).nil?
        = link_to "Like", like_comment_path(comment), method: :post, remote: true
      - else
        = link_to "Unlike", unlike_comment_path(comment), method: :post, remote: true
    - if comment.user == current_user
      = " · "
      = link_to "Delete", comment_path(comment), method: :delete, remote: true,
        :data => { :confirm => "Are you sure you want to delete this comment?" }
  - if likes.count > 0
    .comment-likes
      - likers = likes.map { |like| link_to(like.user_name, "#") }
      - if likers.length > 1
        - likers = likers.slice(0, likers.length - 1).join(", ").concat(" and " +     likers.slice(-1))
      - else
        - likers = likers[0]
      = "Liked by #{likers}".html_safe

app / controllers / comments_controller.rb

class CommentsController < BaseController
  load_and_authorize_resource

  def destroy
    destroy!{ discussion_url(resource.discussion ) }
  end

  def like
    comment_vote = resource.like current_user
    Event.comment_liked!(comment_vote)
    #redirect_to discussion_url(resource.discussion )
    render :partial => "like"
    comment_likes
  end

  def unlike
    resource.unlike current_user
    #redirect_to discussion_url(resource.discussion)
    render :partial => "unlike"
    comment_likes
  end

  def comment_likes
    render :partial => "comment_likes"
  end
end

次に、like、like、comment_likesの.js.erbファイル：

app / views / _like.js.erb

$(".comment-time a#like").html("<%= escape_javascript(render('.comment-time a#like'")

app / views / _unlike.js.erb

$(".comment-time a#unlike").html("<%= escape_javascript(render('.comment-time a#unlike'")

app / views / _comment_likes.js.erb

$(".comment-likes a##").html("<%= escape_javascript(render('.comment-likes a##'")

現在、「いいね」をクリックするとデータベースが更新されますが、ページが更新されるまで変更は表示されません。個々のdivをajaxで更新したいだけです。divに関するもう少し情報が役立つと、rubyがhtmlを作成し、それに含まれます。例として、またはすでに気に入った場合は、これらのdivを更新して、データベースからの最新情報とhttp：//localhostを含むものを表示する必要があります。 ：3000/コメント/7 / 500（内部サーバーエラー）とは異なります。」

それが重要な場合、残りのスクリプトはCoffeescriptで実行されていますか？コントローラー関数は.js.erbを使用する必要があることを読みましたので、これがすべてに影響を与えないことを願っています。（私のjs.erbが間違っていると確信しています）

4

2 に答える 2

2

これが主な問題であるかどうかはわかりませんが、修正する必要があるのは、.js.erbファイルのrenderステートメントです。

Railsのrenderメソッドでは、引数としてerbテンプレートまたはレンダリングするアクションが必要です。電話をかけるとき：

render('.comment-time a#unlike')

Railsは、ビューパスのどこかに「.comment-timea＃unlike」という名前のテンプレートを見つけようとします。これにより、何らかのエラーが発生する可能性があります。アプリケーション（サーバー上）の（クライアント内の）JavaScriptで起こっていることの違いに注意を払うようにしてください。

したがって、これを修正する1つの方法は次のようになります。まず、ビューのどの部分を更新するかを確認します。簡単にするために、すでに_comment部分があるので、それを使用しましょう。次に、domのどの部分を置き換える必要があるかを判断します。この場合、divは現在のコメントのIDになります。その後、次のことができます。

$("#comment-<%= @comment.id %>").replace_html(
  "<%= escape_javascript render('comments/comment', :comment => @comment) %>"
);

_comment.html.erbこれにより、の部分がレンダリングされapp/views/comments、結果（エスケープ）が（dis-）like.js.erbのjavascriptに挿入され、ブラウザに返送されて実行されます。次に、ブラウザはreplace_htmlコメントのdiv（IDで示されます）を確認します。

コメントdiv全体を置き換えるため、好き嫌いの両方に同じ方法を使用できます。帯域幅を節約する必要がある場合は、「いいね」ボタン自体のみを再レンダリングするように微調整できますが、今のところこれは機能します。

于 2012-09-25T15:29:47.413 に答える
1

問題は、コントローラーがajaxリクエストに応答する方法を知らないことです。デフォルトでは、renderメソッドはhtml.erbまたはあなたの場合はhtml.hamlテンプレートをレンダリングします。

あなたが次のようなことをしない限り：

respond_to do |format|
  format.js { comment_likes }
end

これで、ajaxリクエストが来ると、_comments_likes.js.erbテンプレートがレンダリングされます。

これらのajaxyタイプの質問がもっとある場合は、レールのajaxガイドを書き直すための努力が払われています。

そして、によって、あなたのビューをクリーンアップすることを検討してください。

于 2012-09-25T15:43:09.953 に答える