загрузка комментария без обновления страницы с использованием ajax в rails не работает - PullRequest
Новая
       13

загрузка комментария без обновления страницы с использованием ajax в rails не работает

0 голосов
/ 24 сентября 2018

Все, я пытаюсь внедрить систему комментариев и ответов и имею возможность отображать комментарии без перезагрузки страницы.Я следовал различным примерам и вижу, что я получаю ответ 200 со стороны jquery, но все еще не могу увидеть, как страница перезагружается или обновляется с данными ... Может ли кто-нибудь помочь пролить свет на то, где я ошибаюсь?Я все еще новичок в рельсах, все еще учусь ...

Основная проблема в том, что я не могу видеть комментарии, пока не обновляю страницу .... я знаю, что делаю что-то очень глупое, но этопроцесс обучения.

comments_controller.rb 

def create
  @comment = @commentable.comments.new comment_params
  @comment.user_id = current_user.id
  @comment.user = current_user
  respond_to do |format|
    if @comment.save
      # format.js
      #redirect_to @commentable
      # format.js
      # current_user.useractivities.create(action: "commented", eventable_id: 
      @comment.id, eventable_type: @comment.body)

      #redirect_to @commentable, notice: "Your Comment was successful"
      format.html {redirect_to @commentable, notice: "successfully created"}
      #format.json {render @commentable }
      #current_user.activity_events.create(eventable: @user)
      #format.html { redirect_to(:back) }
      #format.json {render json: comment }
      format.js
    else
      format.html { render :action => "new" }
      format.json {render json: @commentable }
      #redirect_to @commentable, alert: "Opps unable to post comment"
      #render format.js
      format.js
    end
  end
end

Файл ROUTE.RB 

resources :createcampaigns do
  resource :like, module: :createcampaigns
  resources :campaignsteps, controller: 'createcampaigns/campaignsteps'
  resources :organizers
  resources :categories
  resources :comments, module: :createcampaigns
  resources :replies, module: :createcampaigns

  member do
    get  :follow
    post :signpetition
    get  :likecomment
    get  :dislikedcomment
    post :upvote
    post :downvote
    get  'like'
    get  'unlike'
    post :follow
    get  :likecampaign
    get  :unlikecampaign
    get  :unfollow
    post :unfollow
    post :destroy
    get  :zipcodeURL
    get  :search, controller: :main
  end
end

Файл комментариев commments / _comments.html.erb 

<div id="comment_pane">
<% commentable.comments.where(parent_id: nil).order(created_at: :desc).each do |comments|%>         
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet">
<div class="container" id="comment_<%=comments.id%>">
    <div class="row">
        <div class="col-md-9">
            <div class="post-content">
              <div class="post-container">
                <%=image_tag(User.find(comments.user_id).image, class: "profile-photo-md pull-left")%>
                <div class="post-detail">
                  <div class="user-info">
                    <h5><a href="timeline.html" class="profile-link"><%=User.find(comments.user_id).first_name%> <%=User.find(comments.user_id).last_name%></a> <span class="following">following
                    <% if current_user.liked? comments %>
                          <%= link_to "", unlike_createcampaign_path(comments.id), remote: true,
                                                id: "like_#{comments.id}",
                                                class: "glyphicon glyphicon-heart" %>
                        <% else %>
                          <%= link_to "", like_createcampaign_path(comments.id), remote: true,
                                                id: "like_#{comments.id}",
                                                class: "glyphicon glyphicon-heart-empty" %>
                        <% end %>
                    
                     <%=current_user.party%>
                    
                    </span></h5>
                  <% if comments.created_at > Time.now.beginning_of_day %>
                 <p class="text-muted"> Posted <%="#{time_ago_in_words(comments.created_at)} ago"%>  </p>
                     <% else %>
                       <span class="following">  <%= comments.created_at.strftime("%b %d, %Y" )%>   </span>
                     <% end %>
                  </div>
                  <div class="reaction">
                    <a class="btn text-green"><i class="fa fa-thumbs-up"></i><%=comments.votes_for.size%><br> </a>
                    <%=link_to "Liked", upvote_createcampaign_path(comments), method: :post%>
                    <a class="btn text-red"><i class="fa fa-thumbs-down"></i> <%=comments.get_downvotes.size %></a>
                    <%=link_to "DIS-LIKE", downvote_createcampaign_path(comments), method: :post %>
                    
                    
                    
                  </div>
                  <div class="line-divider"></div>
                  <div class="post-text">
                    <p><%=comments.body%></p>
                    
                    <%#= react_component 'Main' %>
                    
                       <div class="text-right">
                       <button type="button" class="btn btn-xl btn-primary btn-rounded" data-toggle="modal" data-target="#<%=comments.id%>">
                        ADD A REPLY
                      </button>
                      </div>
                  </div>
             
                     <!-- Button trigger modal -->
         

            <!-- Modal -->
            <div class="modal fade" id="<%=comments.id%>" tabindex="-1">
              <div class="modal-dialog modal-lg">
                <div class="modal-content">
                  <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">×</button>
                    <h4 class="modal-title">Add a Reply</h4>
                  </div>
                  <div class="modal-body">
                    <%= render partial: "comments/form", locals: {commentable: comments.commentable, parent_id: comments.id, class: "", target: "reply.form" }%>
                  </div>
                </div>
              </div>
            </div>
                  <!-- if Reply exist, then show these by the user -->
                  <div class="line-divider"></div>
                  
                  <div class="panel">
          <div class="panel-heading">
           
          <%@pagination = commentable.comments.where(parent_id: comments.id).paginate(:page => params[:page], :per_page => 5).order("created_at DESC")%>
            <%@replycount = commentable.comments.where(parent_id: comments.id)%>
            <span class="panel-title"><%=@replycount.count%> Replies to <%=User.find(comments.user_id).first_name%> <%=User.find(comments.user_id).last_name%> Comment</span>
          </div>
          <% commentable.comments.where(parent_id: comments.id).limit(3).order(created_at: :desc).each do |reply|%> 
          <div class="widget-messages-alt-item">
            
             <%=image_tag(User.find(reply.user_id).image, class: "widget-messages-alt-avatar")%>
            <div  class="widget-messages-alt-subject"><%=reply.body%> </div>
            <div class="widget-messages-alt-description">from <a href="#"> <%=User.find(reply.user_id).first_name%> <%=User.find(reply.user_id).last_name%></a></div>
            <% if reply.created_at > Time.now.beginning_of_day %>
                 <p class="widget-messages-alt-date"> Replied <%="#{time_ago_in_words(reply.created_at)} ago"%>  </p>
                     <% else %>
                       <span class="Replied">  <%= reply.created_at.strftime("%b %d, %Y" )%>   </span>
                     <% end %>
           
          </div> 
           
          <%end%>
              <% if @replycount.count>3%>
          <a  class="widget-more-link" data-toggle="modal" data-target="#commentModal<%=comments.id%>">MORE MESSAGES</a>
          <%end%> 
         
        </div>
    



<!-- The Modal for all comments list-->
<div class="modal" id="commentModal<%=comments.id%>">
  <div class="modal-dialog">
    <div class="modal-content">

      <!-- Modal Header -->
      <div class="modal-header">
        <h4 class="modal-title">View All Messages</h4>
        <button type="button" class="close" data-dismiss="modal">&times;</button>
      </div>

      <!-- Modal body -->
      <div class="modal-body">
           here is where the list of all comment going to be appearing
                
                  <div class="panel">
          <div class="panel-heading">
            <%@replycount = commentable.comments.where(parent_id: comments.id)%>
            <span class="panel-title"><%=@replycount.count%> Replies to <%=User.find(comments.user_id).first_name%> <%=User.find(comments.user_id).last_name%> Comment</span>
          </div>
          <% commentable.comments.where(parent_id: comments.id).order(created_at: :desc).each do |reply|%> 
          <div class="widget-messages-alt-item">
            
             <%=image_tag(User.find(reply.user_id).image, class: "widget-messages-alt-avatar")%>
            <a href="#" class="widget-messages-alt-subject"><%=reply.body%> </a>
            <div class="widget-messages-alt-description">from <a href="#"> <%=User.find(reply.user_id).first_name%> <%=User.find(reply.user_id).last_name%></a></div>
            <% if reply.created_at > Time.now.beginning_of_day %>
                 <p class="widget-messages-alt-date"> Replied <%="#{time_ago_in_words(reply.created_at)} ago"%>  </p>
                     <% else %>
                       <span class="Replied">  <%= reply.created_at.strftime("%b %d, %Y" )%>   </span>
                     <% end %>
            
          </div> 
          
          <%end%>
               

          <a href="#" class="widget-more-link">MORE MESSAGES</a>
        </div>
      </div>

      <!-- Modal footer -->
      <div class="modal-footer">
        <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
      </div>

    </div>
  </div>
</div>    
             
             
                </div>
              </div>
            </div>
        </div>
    </div>
   
</div>

  <%end%>

        </div>

CREATE.JS.ERB для комментария comments / create.js.erb 

$('#comment_pane).prepend("<%=j render 'comments/comments', commentable: 
 @commentable %>");
 $('#comment_content_<%= @comment.id %>').val('')

Показать страницу в Createcampaign / show

  <div id ="comments">
        <div class="panel">
           <div class="panel-title">
              <h1> Comments </h1>
           </div>

           <%= render partial: "comments/comments", locals: {commentable: 
             @createcampaign}%>

           <div class="panel-body">
           </div>
        </div>
     </div>
    </div>
  </div>

Createcampaigns / comments_controller.rb 

class Createcampaigns::CommentsController < CommentsController
  before_action :set_commentable


  private
    def set_commentable
      @commentable = Createcampaign.find(params[:createcampaign_id])
    end
end

Вкладки Chrome Network показывают 200 ok

...