I have 2 model Post and Comment, where Post has-many Comments and Comment belongs_to Post.
Every thing working fine with creation of posts and comments for that posts.
Now I have a requirement where when I click on "create new comment" in posts/show page, I want to show the comments/_form in modal.
comments_controller.rb:
class CommentsController < ApplicationController
before_action :set_comment, only: [:show, :edit, :update, :destroy]
# GET /comments
# GET /comments.json
def index
#comments = Comment.all
respond_with(#comments)
end
# GET /comments/1
# GET /comments/1.json
def show
respond_with(#comments)
end
# GET /comments/new
def new
#post = Post.find(params[:post_id])
#comment = #post.comments.build
end
# GET /comments/1/edit
def edit
#post = Post.find(params[:post_id])
end
# POST /comments
# POST /comments.json
def create
#post = Post.find(params[:post_id])
#comment = #post.comments.create(comment_params)
respond_to do |format|
if #comment.save
format.html { redirect_to(#comment, :notice => 'Article was successfully created.') }
format.xml { render :xml => #comment, :status => :created, :location => #comment }
format.js
else
format.html { render :action => "new" }
format.xml { render :xml => #comment.errors, :status => :unprocessable_entity }
format.js
end
end
end
# PATCH/PUT /comments/1
# PATCH/PUT /comments/1.json
def update
#post = Post.find(params[:post_id])
#comment.update(comment_params)
redirect_to post_path(#post)
end
# DELETE /comments/1
# DELETE /comments/1.json
def destroy
#comment.destroy
respond_to do |format|
format.html { redirect_to comments_url, notice: 'Comment was successfully destroyed.' }
format.json { head :no_content }
end
end
private
# Use callbacks to share common setup or constraints between actions.
def set_comment
#comment = Comment.find(params[:id])
end
# Never trust parameters from the scary internet, only allow the white list through.
def comment_params
params.require(:comment).permit(:commenter, :description)
end
end
posts/show.html.erb:
<%= link_to 'New Coment', new_post_comment_path(#post), :id => 'create_comment' %>
comments/new.html.erb:
<div id="content">
<h1>New Comment</h1>
<%= render 'form' %>
</div>
comments/_form.html.erb:
<%= form_for([#post, #comment], :remote => true) do |f| %>
<div class="field">
<%= f.label :commenter %><br>
<%= f.text_field :commenter %>
</div>
<div class="field">
<%= f.label :description %><br>
<%= f.text_field :description %>
</div>
<div class="actions">
<%= f.submit %>
</div>
<% end %>
comments/create.js.erb:
<%- if #comment.errors.any? %>
console.log('Error');
$('#dialog-form').html('<%= escape_javascript(render('form')) %>');
<%- else %>
console.log('Created');
$('#dialog-form').dialog('close');
$('#dialog-form').remove();
$('table').append('<%= escape_javascript(render(#comment)) %>');
<%- end %>
I don't know where I went wrong. When I click on "create comment" it is redirecting to new page instead of pop-up model and even couldn't create comment.
Please help.
Create a partial for showing comment form.
Render this partial to post show page as hidden.
show hidden partial.
Example:
<%= link_to 'Show Modal', "#", data: {toggle: "modal", target: "#modal"} %>
hidden partial
<div class="modal hide fade" id="modal" title="My modal">
/* your comment form */
/* render comment form */
</div>
Just make sure target is your hidden partial id.
Related
I'm a newbie on rails and have created a listings and reviews app, (yelp type) and I want users to vote on the reviews, I have installed act as votable and configured as below but I seem to be missing something... any ideas why am getting that error?
Below is my routes.rb
Rails.application.routes.draw do
devise_for :users
resources :listings do
resources :reviews, except: [:show, :index, :upvote, :downvote] do
resources :user do
put "upvote", to: "reviews#upvote"
put "downvote", to: "reviews#downvote"
end
end
end
get 'pages/about'
get 'pages/how'
get 'pages/faqs'
get 'pages/contact'
get 'pages/privacy'
get 'pages/tos'
get 'pages/guidelines'
root 'listings#index'
# For details on the DSL available within this file, see http://guides.rubyonrails.org/routing.html
end
Here is my show.html.erb, I will turn it into a partial when it works
<div class="row">
<div class="col-md-3">
<%= image_tag #listing.image_url (:medium) %>
<h3><%= #listing.name %></h3>
<div class="star-rating" data-score= <%= #avg_rating %> ></div>
<p class="small"><%= "#{#reviews.length} reviews" %></p>
<address>
<strong>Address:</strong>
<%= #listing.address %><br>
<strong>Phone:</strong>
<%= #listing.phone %><br>
<strong>Email:</strong>
<%= mail_to #listing.email %> <br>
<strong>Website:</strong>
<%= link_to #listing.website, #listing %>
</address>
<hr>
<p>
<strong>About:</strong>
<p><%= h(#listing.description).gsub(/\n/, '<br/>').html_safe %></p>
</p>
</div>
<div class="col-md-9">
<%= link_to "Haiya, Post a Review ", new_listing_review_path(#listing), class: "btn btn-info" %> <br><br>
<table class="table">
<thead>
<tr>
<th class="col-md-3"></th>
<th class="col-md-9"></th>
</tr>
</thead>
<tbody>
<% if #reviews.blank? %>
<tr>
<p>No reviews yet. Be the first to write one!</p>
<% else %>
<% #reviews.each do |review| %>
<td>
<h4> <%= "#{review.user.first_name.capitalize} #{review.user.last_name.capitalize[0]}." %></h4>
<p class = "small"><%= time_ago_in_words(review.created_at) %> ago </p>
</td>
<td>
<div class="star-rating" data-score= <%= review.rating %> ></div>
<p><%= h(review.comment).gsub(/\n/, '<br/>').html_safe %></p>
<%= link_to 'UP', listing_review_user_upvote_path(#listing, review), method: :put %>
<!-- Check if user is signed in, to enable edit and update -->
<% if user_signed_in? %>
<% if (review.user == current_user) || (current_user.admin?) %>
<%= link_to "Edit", edit_listing_review_path(#listing, review), class: "text-left" %>
<%= link_to "Delete", listing_review_path(#listing, review), method: :delete, class: "text-left" %>
<% end %>
<% end %>
</td>
</tr>
<% end %>
<% end %>
</tbody>
</table>
</div>
</div>
<% if user_signed_in? && current_user.admin? %>
<%= link_to 'Edit', edit_listing_path(#listing), class: "btn btn-link" %> |
<% end %>
<%= link_to 'Back', listings_path, class: "btn btn-link" %>
<!--The script for star ratings. -->
<script>
$('.star-rating').raty({
path: 'https://s3.eu-west-2.amazonaws.com/bebuwaphotos/uploads/stars',
readOnly: true,
score: function() {
return $(this).attr('data-score');
}
});
</script>
Here is my reviews controller
class ReviewsController < ApplicationController
before_action :authenticate_user!
before_action :set_listing
before_action :set_review, only: [:show, :edit, :update, :destroy, :upvote, :downvote]
before_action :check_user, only: [:edit, :update, :destroy]
# GET /reviews/new
def new
#review = Review.new
end
# GET /reviews/1/edit
def edit
end
#Added the def upvote and downvote
def upvote
#review = Review.find(params[:id])
#review.upvote_from current_user
redirect_to :back
end
def downvote
#review = Review.find(params[:id])
#review.downvote_from current_user
redirect_to :back
end
# POST /reviews
# POST /reviews.json
def create
#review = Review.new(review_params)
#review.user_id = current_user.id
#review.listing_id = #listing.id
respond_to do |format|
if #review.save
format.html { redirect_to #listing, notice: 'Your review was successfully posted.' }
format.json { render :show, status: :created, location: #review }
else
format.html { render :new }
format.json { render json: #review.errors, status: :unprocessable_entity }
end
end
end
# PATCH/PUT /reviews/1
# PATCH/PUT /reviews/1.json
def update
respond_to do |format|
if #review.update(review_params)
format.html { redirect_to root_url, notice: 'Your Review was successfully updated.' }
format.json { render :show, status: :ok, location: #review }
else
format.html { render :edit }
format.json { render json: #review.errors, status: :unprocessable_entity }
end
end
end
# DELETE /reviews/1
# DELETE /reviews/1.json
def destroy
#review.destroy
respond_to do |format|
format.html { redirect_to listing_path(#listing), notice: 'Your Review was successfully destroyed :(.' }
format.json { head :no_content }
end
end
private
# Use callbacks to share common setup or constraints between actions.
def set_review
#review = Review.find(params[:id])
end
#Check user
def check_user
unless (#review.user == current_user) || (current_user.admin?)
redirect_to root_url, alert: "Sorry, this review belongs to someone else, you can only edit reviews you have posted."
end
end
#set listing
def set_listing
#listing = Listing.find(params[:listing_id])
end
# Never trust parameters from the scary internet, only allow the white list through.
def review_params
params.require(:review).permit(:rating, :comment)
end
end
And my model :
class Review < ApplicationRecord
belongs_to :user
belongs_to :listing
validates :rating, :comment, presence: true
validates :rating, numericality: {
only_integer: true,
greater_than_or_equal_to: 1,
less_than_or_equal_to: 5,
message: "You have to select at least 1 star if not more stars.."
}
acts_as_votable
end
Finally here is my error
Please explain like you would to a newbie.. or a 5 year old .
Thank you Eshan, followed your answer and got the following error.
You are doing well as a newbie.
The first thing you do when you get an error related to routes, you run rails routes in commandline, so you can see your routes in front of you :
Problem:
You are having a problem with listing_review_user_upvote path, which leads to /listings/:listing_id/reviews/:review_id/user/:user_id/upvote(.:format) URI pattern as you see above.
This route needs three params: listing_id, review_id, and user_id, but you call it this way in your view:
listing_review_user_upvote_path(#listing, review).
You don't send user_id at all, meanwhile you don't even need it since you use current_user in your controller's action.
Solution:
I suggest you to update your routes to be:
resources :listings do
resources :reviews, except: [:show, :index] do
put "upvote", to: "reviews#upvote"
put "downvote", to: "reviews#downvote"
resources :user
end
end
And to use it in your view this way, with ids instead of objects :
listing_review_user_upvote_path(#listing.id, review.id)
These two steps will resolve your problem hopefully.
Finally, except option is used with resources to avoid generating some of its CRUD routes like: update, index, edit, you don't need to use it with your custom routes like: upvote and downvote.
Update:
You should use the correct param in your controller, review_id rather than id, change review = Review.find(params[:id]) to review = Review.find(params[:review_id])
I suggest you to use find_by(id: params[:review_id rather than find(params[:review_id because find method raises an exception if it couldn't find the object in db.
I am using the gem "acts_as_votable" in my Rails application so that Users can vote on Posts.
I'm adding Ajax functionality so that the entire page doesn't have to refresh when a user upvotes a post. This is what I have:
routes.rb
Rails.application.routes.draw do
devise_for :users, controllers: {registrations: 'registrations'}
resources :posts do
member do
put "like", to: "posts#upvote"
put "dislike", to: "posts#downvote"
end
end
# Define Root URL
root 'pages#index'
# Define Routes for Pages
get '/home' => 'pages#home'
get '/explore' => 'pages#explore'
get '/privacy' => 'pages#privacy'
get '/:id' => 'pages#profile'
end
pages_controller.rb
def explore
#posts = Post.where('created_at >= :one_days_ago', one_days_ago: Time.now - 16.hours)
end
posts_controller.rb
class PostsController < ApplicationController
def index
#posts = Post.allow
end
def new
#post = Post.new
end
def create
#post = Post.new(post_params)
#post.user_id = current_user.id
respond_to do |f|
if (#post.save)
f.html { redirect_to :back, :flash => { :notice => "Posted" } }
else
f.html { redirect_to :back, :flash => { :alert => "Error" } }
end
end
end
def destroy
#post = Post.find(params[:id])
if current_user == #post.user
#post.destroy
end
redirect_to :back, alert: 'Deleted.'
end
def upvote
#posts = Post.find(params[:id])
#posts.upvote_by current_user
respond_to do |format|
format.html { redirect_to :back }
format.js
end
end
def downvote
#posts = Post.find(params[:id])
#posts.downvote_by current_user
respond_to do |format|
format.html { redirect_to :back }
format.js
end
end
private
def post_params # allows certain data to be passed via form.
params.require(:post).permit(:user_id, :content)
end
end
explore.html.erb
<% if #posts.each do |p| %>
<div class="panel-body">
<p class="post-content"><%= auto_link(p.content, :html => { :target => '_blank' }) %></p>
<%= render :partial => 'vote', :class => "vote", :locals => { p: #posts } %>
</div>
<% end %>
_vote.html.erb
<div id="vote_<%= p.id %>" class="vote">
<%= link_to 'Vote Up', like_post_path(p), :class => "upvote", :method => :put, :remote => true %>
<span><%= p.score %></span> <!--show the current vote-->
<%= link_to 'Vote Down', dislike_post_path(p), :class => "downvote", :method => :put, :remote => true %>
</div>
upvote.js.erb
$(document).ready(function(){
$('#vote_<%= p.id %>').html("<%= escape_javascript render :partial => '/pages/vote' %>");
});
When I go to run the project I get this error:
NoMethodError in Pages#explore
Showing /home/ubuntu/workspace/app/views/pages/_vote.html.erb where line #1 raised:
undefined method `id' for #<Post::ActiveRecord_Relation:0x007f6715d018e8>
Did you mean? ids
<div id="vote_<%= p.id %>" class="vote">
The issue arises from trying to render _votes.html.erb.
Where am I going wrong here? I've been stuck on this for a while and would appreciate any help. Thanks!
You are passing entire collection to partial
<% if #posts.each do |p| %>
<div class="panel-body">
<p class="post-content"><%= auto_link(p.content, :html => { :target => '_blank' }) %></p>
<%= render :partial => 'vote', :class => "vote", :locals => { p: #posts } %>
</div>
<% end %>
In line <%= render :partial => 'vote', :class => "vote", :locals => { p: #posts } %> replace #posts with p
I came across a problem in my web app.
I would like to make a mvc to allow the user create a push from the post (like a ranking or commments). But actualy, the push is creating automatically when the user show the post. So I want this one is created if the user submit the data pushed.
Can you explain me where I make a mistake ?
My code
Show/post view :
<strong>Title:</strong>
<%= #post.title %>
</p>
<p>
<strong>Image:</strong>
<%= image_tag #post.image.url(:medium) %>
</p>
<p>
<strong>Prix:</strong>
<%= #post.prix %>
</p>
<p>
<strong>Description:</strong>
<%= #post.description %>
</p>
<%- if current_user.admin? %>
<div class="btn-group" role="group" aria-label="...">
<%= link_to 'Modifier', edit_post_path(#post), class: "btn btn-warning"%>
<%= link_to 'Supprimer', #post, method: :delete, data: { confirm: 'Confirmer la suppression du plat ?' }, class: "btn btn-danger" %>
<%end%>
<%=link_to "Home", posts_path, class: "btn btn-info"%>
</div>
<div class= "col-md-6">
<div class="push">
<%= render 'pushs/form' %>
</div>
</div>
Push/form (into the views/posts/show) :
<%= simple_form_for([#post, #post.pushs.build]) do |f| %>
<div class="row">
<div class="col-md-12">
<div class="form-group text-center">
<h4>Combien êtes vous ?</h4>
<%= f.text_field :quantity %>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="form-group text-center">
<h4>Ou êtes vous ?</h4>
<%= f.text_field :adress2 %>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="form-group text-center">
<%= f.button :submit %>
</div>
</div>
</div>
<% end %>
the Push controller :
class PushsController < ApplicationController
before_action :authenticate_user!
before_action :set_post
before_action :set_push, only: [:edit, :update, :destroy]
def create
#push = #post.pushs.create(push_params)
#push.user_id = current_user.id
if #push.save
flash[:success] = 'Votre commande est enregisté !'
redirect_to root_path
else
flash[:alert] = "Check the push form, something went horribly wrong."
redirect_to root_path
end
end
def update
if #push.update(push_params)
flash[:success] = 'Votre commande est enregisté !'
redirect_to root_path
else
flash[:alert] = "Check the push form, something went horribly wrong."
render 'edit'
end
end
def destroy
#push = #post.pushs.find(params[:id])
#push.destroy
flash[:success] = "Push deleted :("
redirect_to root_path
end
private
def push_params
params.require(:push).permit(:user_id, :quantity, :prix2, :time, :adress2, :latitude2, :longitude2, :taked, :taked_by, :taked_at, :validated)
end
def set_post
#post = Post.find(params[:post_id])
end
def set_push
#post = Post.find(params[:post_id])
#push = #post.pushs.find(params[:id])
end
end
& the post controller :
class PostsController < ApplicationController
before_action :authenticate_user!
before_action :set_post, only: [:show, :edit, :update, :destroy]
before_action :post_admin, only: [:new, :edit, :update, :destroy]
# GET /posts
# GET /posts.json
def index
#posts = Post.all
end
# GET /posts/1
# GET /posts/1.json
def show
end
# GET /posts/new
def new
#post = Post.new
end
# GET /posts/1/edit
def edit
end
# POST /posts
# POST /posts.json
def create
#post = Post.new(post_params)
respond_to do |format|
if #post.save
format.html { redirect_to #post, notice: 'Post was successfully created.' }
format.json { render :show, status: :created, location: #post }
else
format.html { render :new }
format.json { render json: #post.errors, status: :unprocessable_entity }
end
end
end
# PATCH/PUT /posts/1
# PATCH/PUT /posts/1.json
def update
respond_to do |format|
if #post.update(post_params)
format.html { redirect_to #post, notice: 'Post was successfully updated.' }
format.json { render :show, status: :ok, location: #post }
else
format.html { render :edit }
format.json { render json: #post.errors, status: :unprocessable_entity }
end
end
end
# DELETE /posts/1
# DELETE /posts/1.json
def destroy
#post.destroy
respond_to do |format|
format.html { redirect_to posts_url, notice: 'Post was successfully destroyed.' }
format.json { head :no_content }
end
end
private
# Use callbacks to share common setup or constraints between actions.
def set_post
#post = Post.find(params[:id])
end
def post_admin
if current_user.admin?
else
flash[:alert] = "That post doesn't belong to you!"
redirect_to root_path
end
end
# Never trust parameters from the scary internet, only allow the white list through.
def post_params
params.require(:post).permit(:user_id, :title, :prix, :image, :description, :user_id)
end
end
Thanks, and obviously if you have any suggestions, I am eager to learn
Bye
I am using ajax for creating post that belongs to a particular topic where I render the form in post index page. Each post can have many tags and I am also using devise authentication and CanCanCan authorization.
I need to capture the error message of the post submit and show it in the browser through this JavaScript template Create.js.erb with custom error messages instead of doing in post form.
Below is the code:
Post controller
class PostsController < ApplicationController
load_and_authorize_resource
before_action :set_post, only: [:show, :edit, :update, :destroy, :update_status]
skip_before_action :verify_authenticity_token
# GET /posts
# GET /posts.json
def index
if params[:topic_id].present?
#topic = Topic.find(params[:topic_id])
#posts = #topic.posts.paginate(page: params[:page], per_page: 10)
#post = #topic.posts.new
else
#posts = Post.eager_load(:topic, :user).paginate(page: params[:page], per_page: 10)
end
#tags =Tag.all
end
# GET /posts/1
# GET /posts/1.json
def show
#tags = #posts.tags
end
def update_status
current_user.posts<<(#posts)
end
# GET /posts/new
def new
#topic = Topic.find(params[:topic_id])
#posts = #topic.posts.new
#tags =Tag.all
end
# GET /posts/1/edit
def edit
#tags = #posts.tags
end
# POST /posts
# POST /posts.json
def create
#topic = Topic.find(params[:topic_id])
#posts = #topic.posts.create(post_params)
respond_to do |format|
#posts.user_id = current_user.id
if #posts.save
format.html { redirect_to topic_posts_path(#topic), notice: 'Post was successfully created.' }
format.js
format.json { render :show, status: :created, location: #posts }
else
format.html { render :new }
format.json { render json: #posts.errors, status: :unprocessable_entity }
end
end
end
# PATCH/PUT /posts/1
# PATCH/PUT /posts/1.json
def update
#tags = #posts.tags
respond_to do |format|
if params[:rate].to_i>0
#posts.ratings.create(:star => params[:rate])
format.html { redirect_to post_path(#posts), notice: 'Rating was successfully updated.' }
elsif #posts.update(post_params)
format.html { redirect_to post_path(#posts), notice: 'Post was successfully updated.' }
format.json { render :show, status: :ok, location: #posts }
else
format.html { render :edit }
format.json { render json: #posts.errors, status: :unprocessable_entity }
end
end
end
# DELETE /posts/1
# DELETE /posts/1.json
def destroy
#posts.destroy
respond_to do |format|
format.html { redirect_to topic_posts_url(#posts.topic_id), notice: 'Post was successfully destroyed.' }
format.json { head :no_content }
end
end
private
# Use callbacks to share common setup or constraints between actions.
def set_post
#posts = Post.find(params[:id])
end
# Never trust parameters from the scary internet, only allow the white list through.
def post_params
params.require(:post).permit(:image, :name, :message, :topic_id, {tag_ids:[]}, :rate, :user_id)
end
protected
def json_request?
request.format.json?
end
end
post form
<%= form_for [#topic, #post], remote: true do |f| %>
<% if #post.errors.any? %>
<div id="error_explanation">
<h2><%= pluralize(#post.errors.count, "error") %> prohibited this post from being saved:</h2>
<ul>
<% #post.errors.full_messages.each do |message| %>
<li><%= message %></li>
<% end %>
</ul>
</div>
<div class="field">
<%= f.label :Image %><br>
<%= f.file_field :image %>
</div>
<div class="field">
<%= f.label :Name %><br>
<%= f.text_field :name %>
</div>
<div class="field">
<%= f.label :Message %><br>
<%= f.text_area :message %>
</div>
<% if #tags %>
<% #tags.each do |tag| %>
<div>
<%= check_box_tag "post[tag_ids][]", tag.id, #post.tags.include?(tag) %>
<%= tag.name %>
</div>
<% end %>
<% end %>
<br><br>
<%= link_to 'Create Tag', tags_path %>
<br><br>
<%= f.submit %>
<% end %>
create.js.erb
$("#post_table").append("<%= j render #posts %>");
alert("Post created")
index.html.erb
<p id="notice"><%= notice %></p>
<div id='ajax_loader' style="position: absolute; left: 50%; top: 50%; display: none;">
<%= image_tag "ajax-loader.gif" %>
</div>
<script>
$(document).ajaxStop(function(){
$("#ajax_loader").hide();
});
$(document).ajaxStart(function(){
$("#ajax_loader").show();
});
</script>
<%= will_paginate %>
<h1>Listing Posts</h1>
<table id = "post_table">
<thead>
<tr>
<th><th>Name</th></th>
<th><th>Author</th></th>
<th><th>Message</th></th>
<th><th>Status</th></th>
<th colspan="4"></th>
</tr>
</thead>
<tbody>
<%= render #posts %>
</tbody>
</table>
<br>
<% if #topic %>
<%= link_to 'New Post', "#", id: "new_post" %>|
<section id = "new_post_section">
<%= render 'form' %>
</section>
<%= link_to 'Back to Topics', topic_path(#topic) %>
<% else %>
<% link_to 'New Post', new_post_path %>
<% end %>
<%= will_paginate %>
Post model
class Post < ActiveRecord::Base
belongs_to :user
belongs_to :topic
has_many :comments
has_and_belongs_to_many :tags
has_many :ratings
validates_presence_of :name, :presence => true
validates_length_of :name, maximum: 5
has_attached_file :image
#validates_attachment_presence :image, :presence => true
validates_attachment_content_type :image, :content_type => ['image/jpeg', 'image/png']
validates_attachment_size :image, :in => 0..100.kilobytes
end
Please help me.
Modify your the create action in the posts_controller.rb to something like this (notice that format.js was added to the else clause of the respond_to block):
# POST /posts
# POST /posts.json
def create
#topic = Topic.find(params[:topic_id])
#posts = #topic.posts.create(post_params)
respond_to do |format|
#posts.user_id = current_user.id
if #posts.save
format.html { redirect_to topic_posts_path(#topic), notice: 'Post was successfully created.' }
format.js
format.json { render :show, status: :created, location: #posts }
else
format.html { render :new }
format.js # call create.js.erb on save errors
format.json { render json: #posts.errors, status: :unprocessable_entity }
end
end
end
Then, in create.js.erb you can check for errors and handle them however you'd like. Example:
<% if #post.errors.any? %>
alert("ERROR(S): <%= j #post.errors.full_messages.join('; ') %>")
<% else %>
$("#post_table").append("<%= j render #posts %>");
alert("Post created");
<% end %>
So I'm trying to update my comments section with AJAX without the full page refresh for a college project. However I can't seem to get this working.
In the console it gives me s
Failed to load resource: the server responded with a status of 500 (Internal Server Error)
My show.html.erb file:
<h1>Title: <%= #post.title %></h1>
<h2>Body: <%= #post.body %></h2>
<hr />
<h1>Your comments</h1>
<%= link_to "View comments", "#", id: "comments-link" %>
<ol id="comments">
<%= render 'comments' %>
<hr />
<h1>Create comment</h1>
<%= form_for(#comment, :html => {class: "form", role: "forms"}, :url => post_comments_path(#post), remote: true) do |comm| %>
<div class="container">
<div class="input-group input-group-md">
<%= comm.label :body %>
<%= comm.text_area :body, class: "form-control", placeholder: "Enter a comment" %>
</div>
<%= comm.submit "custom", id: "button" %>
</div>
<% end %>
</ol>
My comments.coffee:
$(document).on "page:change", ->
$('#comments-link').click ->
$('#comments').fadeToggle()
$('#comments_body').focus()
My create.js.erb:
$('#comments').append("<%= j render #comment %>");
and my Comments controller:
class CommentsController < ApplicationController
def index
end
def new
end
def new
#comment = Comment.new
end
def create
#comment = Comment.new(comment_params)
#comment.post_id = params[:post_id]
if #comment.save
flash[:success] = "Successfully created comment"
respond_to do |format|
format.html { redirect_to post_path(#comment.post_id) }
format.js
end
else
flash[:danger] = "Failed to create comment"
redirect_to root_path
end
end
private
def comment_params
params.require(:comment).permit(:body)
end
end
I may have missed some files so just let me know, it is basic as it's just a post and comment system - no styling needed for the project, so yeah. I have been trying this for the last 4 hours and other places just don't work. I've looked on here, Youtube - everywhere however no one else's code works for me so I have come here! Thank's for you're help.
EDIT:
I noticed it said to create a view in the error response, however I made that view and rendered the comment's body onto the create.html.erb however I just need to display the form now.
I notice you are posting to the url post_comments_path(#post). For nested routes, it might be cleaner to do the following:
1) Post to the nested route directly:
<%= form_for([#post, #comment], html: {class: "form", role: "forms"}, remote: true) do |comm| %>
2) Make sure your routes are nested properly, in routes.rb:
resources :posts do
resources :comments
end
3) Refactor your CommentsController, to build through the #post instance:
class CommentsController < ApplicationController
before_action :get_post
def index
#comments = #post.comments
end
def new
#comment = #post.comments.build
end
def create
#comment = #post.comments.build(comment_params)
if #comment.save
flash[:success] = "Successfully created comment"
respond_to do |format|
format.html { redirect_to post_path(#post) }
format.js
end
else
respond_to do |format|
format.html { render :new }
format.js { render :error }
end
end
end
private
def comment_params
params.require(:comment).permit(:body)
end
def get_post
#post = Post.find(params[:post_id])
end
end
4) Render the validation errors in app/views/comments/error.js.erb. I'll let you decide how best to do that, but here's a quick dump to the console:
<% #comment.errors.full_messages.each do |message| %>
console.log("<%= message %>");
<% end %>
This file is not to be confused with your app/views/comments/create.js.erb which is handling successful save of the comment. That should look something like this:
$('#comments').append("<%= j render #comment %>");
$(".form")[0].reset();
5) Tweak your view a little bit. I notice you need to output the comments differently:
<ol id="comments">
<%= render #post.comments %>
</ol>
which should correspond to a partial in app/views/comments/_comment.html.erb so make sure this is there.