How do I reload my comments partial with ajax? - ruby-on-rails

Question

So I'm a beginner in Rails and I'm trying to reload a partial when I create a Comment.
I am creating a sort of forum where I have Posts and Comments on Posts.
Here is the situation :
/views/posts/show.html.erb
<% #posts.each do |post| %>
<%= post.title.capitalize %>
<%= post.content %>
<%= render 'comments/comment', post: post, comments: post.comments %>
<%= form_tag(category_forum_post_comments_path(#category, #forum, post), :method => :post, class: 'form newtopic') do %>
<%= text_field_tag :content, nil, placeholder: 'Commenter', class: 'form-control' %>
<%= submit_tag "Envoyer", class: "btn btn-primary" %>
<% end %>
<% end %>
<%= form_tag(category_forum_posts_path(#category, #forum), :method => :post, class: 'form newtopic') do %>
<%= text_field_tag :title, nil, placeholder: 'Titre de votre Post', class: 'form-control' %>
<%= text_area_tag :content, nil, placeholder: 'Description', id: 'desc', class: 'form-control' %>
<%= submit_tag "Envoyer", class: "btn btn-primary" %>
<% end %>
and then in /views/comments/_comment.html.erb
<% comments.each do |comment|%>
<%= comment.content %>
<%= link_to 'Supprimer', category_forum_post_comment_path(#category, #forum, post, comment),
method: :delete, class: "btn-danger btn-sm", data: { confirm: 'Etes-vous sûr?' } %>
<% end %>
I would like to reload my comment partial on post.
I tried to understand so many posts on stackoverflow and tutorial that I could find online and still have no idea how to do it.
If someone would be kind enough to help me get through this it would be great.

Answer 1

What's the action that you want to trigger that reload? you are showing forms, links, it's not too clear.
Basically, you need to use remote: true on the form/link, then add a view for that action with .js.erb extension, and, on that view, use javascript to change the content of an specific element.
Something like:
1st, you need to give some unique way to reach the element you want with javacsript:
<% #posts.each do |post| %>
<div id="post_<%= post.id -%>">
<%= post.title.capitalize %>
<%= post.content %>
<div class='comments'>
<%= render 'comments/comment', post: post, comments: post.comments %>
</div>
<%= form_tag(category_forum_post_comments_path(#category, #forum, post), :method => :post, class: 'form newtopic') do %>
<%= text_field_tag :content, nil, placeholder: 'Commenter', class: 'form-control' %>
<%= submit_tag "Envoyer", class: "btn btn-primary" %>
<% end %>
</div>
<% end %>
<%= form_tag(category_forum_posts_path(#category, #forum), :method => :post, class: 'form newtopic') do %>
<%= text_field_tag :title, nil, placeholder: 'Titre de votre Post', class: 'form-control' %>
<%= text_area_tag :content, nil, placeholder: 'Description', id: 'desc', class: 'form-control' %>
<%= submit_tag "Envoyer", class: "btn btn-primary" %>
<% end %>
Note the div with id=post_x and the div with class comment
Now you can locate it using javacsript:
#your_view.js.erb
post = document.getElementById('post_<%= #post.id -%>');
comments = post.querySelector('comments');
And finally, also on your view, render the partial and replace comments' innerHTML
comments.innerHTML = '<%= j(render partial: "comments/comment", post: #post, comments: #post.comments) -%>';
Just a suggestion, use "comments" (in plural) for the name of the partial, since you are rendering all the comments and not just one.