これまでに作った機能について簡単にまとめていく。

今回は、

コメント機能をAjax化する

前提条件

コメント機能があること
まだの方はこちら

使用モデル

使用モデル

Userモデル

  カラム データ型
1 name string
2 email text
3 password_digest string

Blogモデル

  カラム データ型
1 title string
2 content text
3 likes_count integer

Commentモデル

  カラム データ型
1 content string
2 user_id bigint
3 blog_id bigint

フォーマットの指定

app/controllers/comments_controller.rb

def create
  @blog = Blog.find(params[:blog_id])
  @comment = @blog.comments.build(comment_params)
  respond_to do |format|
    if @comment.save
      format.html { redirect_to @blog }
      format.js { render :index }
    else
      format.html { redirect_to @blog }
    end
  end
end

JavaScriptの処理を作成

app/views/comments/index.js.erb

$("#comments_area").html("<%= j(render 'comments/index', { comments: @comment.blog.comments, blog: @comment.blog }) %>")
$("textarea").val('')

以上で作成完了