I'm currently using 'acts_commentable_with_threading' on my Post model. I am able to add comments on the show.html.erb page for the posts. What I've been trying to do is add this logic inside of the posts feed for users. I can't seem to add the comments form to the _feed_posts.html.erb partial. Which has a slide-panel for commenting on user posts.
feed\index.html.erb <div class=container> <div class="feed"> <%= render 'feed/feed_posts', following_activities: @following_activities %> </div> </div>
_feed_posts.html.erb
<div class="container-fluid"> <% @following_activities.each do |post| %> <div class="tile_padding"> <div class="tile_container"> <div class="user_avatar_pos"> <%= link_to(image_tag(post.user.avatar.url(:thumb), class: 'round-image-50'), user_path(post.user), lazy: true) %> </div> <div class="tile_photo"> <%= image_tag(post.photo.url(:medium), lazy: true) %> </div> <div class="user_sn"> <%= link_to(post.user.username, post.user) %> </div> <hr> <div class="feed_body"> <%= linkify_hashtags(post.body) %> </div> </div> <div class="tile_sidebar"> <ul id="experience_feed_footer"> <li> <div class="like_btn_pos like_post"> <% if current_user.liked? post %> <%= link_to dislike_post_path(post), class: 'fa fa-star fa-lg unlike_post', style: 'text-decoration: none; color: yellow;', method: :get do %> <%= post.get_likes.size %> <% end %> <% else %> <%= link_to like_post_path(post), class: 'fa fa-star fa-lg like_post', style: 'text-decoration: none; color: #494c4f;', title: 'like', method: :get do %> <%= post.get_likes.size %> <% end %> <% end %> </div> </li> <li> <div class="exp_feed_delete_btn"><span><i class="fa fa-times" style="color: darkred;"></i></span> <% if post.user == current_user && user_signed_in? %><%= link_to 'Delete', post, method: :delete, data: {confirm: 'Are you sure?'}, style: 'color: darkred;' %> <% end %></div> </li> <li> <div class="feed_li_reply_btn"><p> <button class="reply_btn" id="trigger">Reply <%= image_tag 'double-arrow-right.png' %></button></div> </li> </ul> </div> </div>
<div class="slider" id="slider"> <div class="exp_com_section_header"> <h1>Comments <%= post.comment_threads.count == 0 ? "0" : post.comment_threads.count %></h1>
//Comments/reply form inside of slider
</div> </div> <% end %>
<script type="text/javascript"> $(document).ready(function () { $('img').lazyload({ threshold: 500, effect: 'fadeIn' }); });
$(document).ready(function (){ $('#slider').slideReveal({ push: false, position: 'right', speed: 600, trigger: $("#trigger"), overlay: true, top: 100, width: 500 }); }); </script> </div>
//Comments Partial Form {Doesn't work in view, but has no issues in show action for post.}
<%= form_for @new_comment do |f| %> <%= f.hidden_field :commentable_id, value: @new_comment.commentable_id %> <%= f.hidden_field :commentable_type, value: @new_comment.commentable_type %> <div class="field form-group"> <%= f.text_area :body, class: 'form-control' %> </div> <div class="field form-group"> <%= submit_tag 'Post comment', class: 'btn btn-primary-outline btn-sm' %>
//Comments _reply.html.erb <!-- Displays each comment with reply link for that comment --> <% comments.each do |comment| %> <div class="comments-show"> <div class="comment"> <div class="user-name" style="color: #151619; font-weight: bolder;"> <%= comment.user.username.capitalize %> </div> <p><%= link_to(image_tag(comment.user.avatar_url(:thumb), class: 'round-image-50'), user_path(comment.user)) %> <%= linkify_hashtags comment.body %> <%= awesome_link 'fa-times-circle', comment, method: :delete, remote: true, data: {disable_with: 'Deleting Comment'}, style: 'color: red;' %> <br></p>
<div class="comment-nav"><a href="#" class="comment-reply"><i class="fa fa-reply"></i> Reply</a></div> <div class="reply-form"> <%= form_for @new_comment do |f| %> <%= f.hidden_field :commentable_id, value: @new_comment.commentable_id %> <%= f.hidden_field :commentable_type, value: @new_comment.commentable_type %> <%= f.hidden_field :comment_id, value: comment.id %>
<div class="field form-group"> <%= f.text_area :body, class: 'form-control' %> </div> <div class="field form-group"> <%= submit_tag 'Post Reply', class: 'btn btn-primary' %> </div> <% end %> </div> </div> <%= render partial: 'comments/reply', locals: {comments: comment.children} %> </div> <% end %>
These two forms are actually brought together inside of a template partial.
<div class="comments-header"> <p> <%= commentable.comment_threads.count == 0 ? 'No New' : commentable.comment_threads.count %> Comments </p> </div>
<%= render partial: 'comments/form', locals: {new_comment: new_comment} %>
<div class="comments-container"> <%= render partial: 'comments/reply', locals: {comments: commentable.root_comments} %> </div>
//Renders comment/reply forms inside of one file <%= render partial: 'comments/template', locals: {commentable: @post, new_comment: @comment} %>
I need a form instance to populate each slider for each post. The slide-out panel is working to an extent. It doesn't populate with data from nth elements. Only the top element on the page is loaded and I cannot add comments to it. What approach would you take given the code that I've shown you?