2

ユーザーのコメントに表示/非表示機能を実装しています。

ここで議論:https ://stackoverflow.com/a/10174194/439688

私の目的は次のとおりです。1。デフォルトで表示されるコメントを2に制限します。2。特定のマイクロポストの合計コメント数を示すテキストのスパンを設定し、ユーザーがクリックすると、そのマイクロポストのすべてのコメントを展開して表示します。Jquery / Ajaxを使用して、非表示、表示、追加などを行います。

最初の変更は、ユーザーに表示されるコメントの量を制限することでした。これは、ヘルパーに「コメント」というメソッドを作成することで実現しました。ここで、コメントが属するマイクロポストのIDを渡します。

  def get_comments(micropost_id)
       Comment.limit(2).order("created_at DESC").where(:micropost_id => micropost_id)
  end

これで、各コメントをループする各ループには、最新の2つのコメントのみが表示されます。

  <<% @microposts.each do |m| %>
    <% if m.poster_id.nil? %>
       <div class="postHolder">
        <nav class="micropostOptions">
         <ul class="postMenu">
           <li class="deletePost"><%= link_to content_tag(:span, "Delete post"), m, :method => :delete, :confirm => "Are you sure?", :title => m.content, :class => "message_delete", :remote => true %>
           </li>
           <li class="disableCommenting"><%= link_to content_tag(:span, "Pause commenting"), "2" %></li>
           <li class="blockCommenter"><%= link_to content_tag(:span, "Block commenter"), "3" %></li>
           <li class="openInNewWindow"><%= link_to content_tag(:span, "Open in new window"), "4" %></li>
           <li class="reportAbuse"><%= link_to content_tag(:span, "Report abuse"), "5" %></li>
         </ul>  
       </nav>


                <%= link_to image_tag(default_photo_for_current_user, :class => "poster_photo"), current_users_username %>

<div class="post_content">
    <div class="post_container">

        <div class="mainUserNameFontStyle"><%= link_to current_users_username.capitalize, current_users_username %> - <div class="post_time"> <%= time_ago_in_words(m.created_at) %> ago.</div> 
        </div>  
                  <%=  simple_format h(m.content) %> </div>
            <div class="commentsCount">
                <%= content_tag :span, pluralize(m.comments.count, 'comment'), :class => "view_all_comments" if m.comments.any? %>
            </div>
                        <% if m.comments.any? %>

                   <% comments(m.id).each do |comment| %>

                    <div class="comment_container">

                        <%= link_to image_tag(default_photo_for_commenter(comment), :class => "commenter_photo"), commenter(comment.user_id).username %>

                        <div class="commenter_content"> <div class="userNameFontStyle"><%= link_to commenter(comment.user_id).username.capitalize, commenter(comment.user_id).username %> - <%=  simple_format h(comment.content) %> </div>
                    </div><div class="comment_post_time"> <%= time_ago_in_words(comment.created_at) %> ago. </div>


                   </div>


                        <% end %>
                    <% end %>


                <% if logged_in? %>
                <%= form_for @comment, :remote => true do |f| %>
                <%= f.hidden_field :user_id, :value => current_user.id %>
                <%= f.hidden_field :micropost_id, :value => m.id %>
                <%= f.text_area :content, :placeholder => 'Post a comment...', :class => "comment_box", :rows => 0, :columns => 0 %>

        <div class="commentButtons">         
          <%= f.submit 'Post it', :class => "commentButton", :disable_with => "Post it" %>
           <div class="cancelButton"> Cancel </div>
        </div>   
                <% end %>

                <% end %>
    </div>


</div>

ここから、これは私にとって混乱するところです。link_toをもう少し使用しましたが、コメント数のURLをブラウザのステータスバーに表示したくないと判断しました。これが、スパンの使用に切り替えた理由です。しかし、link_to / remote => trueを使用できなくなったため、やりたいことを実行するのは簡単ではありません。

ユーザーがコメントカウントスパンをクリックしたときにajax呼び出しが行われるようにするにはどうすればよいですか?

  def load_comments

  @load_comments = Comment.where(:micropost_id => params[:id])   
    respond_to do |format|
    format.js   { render :load_comments } 
    end

  end

users.jsにクリック関数を配置することを考えましたが、上記のコードの各ループにあるマイクロポストのパラメーターをusers.jsに渡すにはどうすればよいですか?それは不可能だと思います。

コメントの投稿はすべてajaxを介して行われますが、これらのフォームを使用したため、remote => trueを追加し、いくつかのjsテンプレートを作成して、ajax投稿の成功に対して何かを行う方がはるかに簡単でした。

私がこれを正しい方法で行っているかどうかさえわかりません。より経験豊富なレールプログラマーからの助け/アドバイスをいただければ幸いです。

敬具

4

3 に答える 3

2

Rails パーシャル

#このパーシャルに渡された local に基づいてすべてのコメントを表示します

# 最初は limit を 2 (または任意) として渡します。次に、スパンパス制限をクリックするとnilになります。次に、制限が nil かどうかを確認できます。制限指定子なしでモデルをクエリできます。

<% @comments = Comment.custom_find(@your_params) %>
<% @comments.each do |comment|  %>
<%= comment.title %>
<% end %>

JavaScript/jquery

function load_all_comments(id)
{
   new Ajax.Updater('show_comments',
      '<%=url_for(:controller => "your_controller", :action => "your_action")%>', {
       parameters: {'id':id },
       method:     'get',
       onSuccess: function(request){
       div_comments = document.getElementById("partial_comments_list");
       div_comments.innerHTML = request.responseText;

      }
   });
} // you can call this js function on span click. use jquery if you want. 

コントローラ:

次に、your_controller の your_action 内で、パーシャルをレンダリングすることを忘れないでください。

   render :partial => "show_comments", :layout => false

編集:

you can even pass locals to your partial

 render :partial => "show_comments", :locals => {:post => @post}

渡すローカルに基づいて、部分ビューが更新されるたびにこれを使用します。

もちろん、これは単なる例であり、完全なコード/ソリューションではありません。

もっと良い方法があるかもしれません。しかし、これは私にとってはうまくいきました。

于 2012-04-17T17:54:08.630 に答える
1

別のオプションは、すべてのコメントを出力し、最初に表示したくないコメントを非表示にすることです。<div class="hidden_comments" style="display:none;"> a comment </div>

次に、スパンがクリックされたときにそれらを表示するためのJavaScriptをいくつか用意してください。

<script type="text/javascript">
   $("#span_id").click(function() {
      $('.hidden_comments').show();
});
</script>

大量のコメントがない場合、これはうまく機能します。


あなたが本当に自分のやり方でやりたいのなら、私は以前にやったことがありますが、面倒です.

これをapplication.jsに入れます

$('.comment_span').live('click', function () {
    $.get(this.data_url, null, update_row, 'json');
    return false;
  });

スパンは次のようになります。

<span class="comment_span" data_url="http://website.com/resource/more_comments">
  show all comments
</span>

この例ではデータが json として返されるため、update_row 関数を使用してコメント データを更新し、置き換えました。

 function update_row(data, status) {
    $("#comments-table").append(data.html);
  };

これが私のコントローラーの外観です。

  def more_comments
    @comments = Comments.all

    if @comments
      respond_to do |format|
        format.js {
                render :json => { 
                  :html => render_to_string(:partial => "comments"),
                  }.to_json
              }
      end
    end
  end
于 2012-04-17T17:44:51.520 に答える
0

index アクションを介してこれを行う必要があります。パラメータを渡して、すべてのコメントを表示するか、現在のセットのみを表示するかを決定します (これを処理するために will_paginate を使用します。今は電話を使用しているので、コードを詳しく調べていませんが、何かこのような:

class CommentsController < ApplicationController
  def index
    If params[:show_all] == "true"
      @comments = Comment.all
    else
      @comments = Comment.where(foo: bar).paginate(per_page: 2, page: params[:page])
    end
  end

次に、JavaScript に応答させ、Ajax リクエストでページ パラメータを送信します。

于 2012-04-18T01:31:54.830 に答える