0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Ruby on Rails チュートリアル 第14章 フォローフォームでのAjaxの採用

Last updated at Posted at 2019-11-09

#Ajaxの使用法と効果
 ここではRailsチュートリアル14章におけるフォローフォーム作成の際にAjaxを導入する方法及びその効果について説明する。
 まず、Ajaxの導入方法については、フォーム側の更新作業としては

app/views/users/_follow.html.erb
<%= form_for(current_user.active_relationships.build, remote: true) do |f| %>
  <div><%= hidden_field_tag :followed_id, @user.id %></div>
  <%= f.submit "Follow", class: "btn btn-primary" %>
<% end %>

上記のコードのように、form_forメソッドの引数にremote: trueのハッシュを与えるだけでよい。こうすることでRailsは自動的にAjaxを使うようになる。(*なお、上記の_follow.html.erbファイルはフォロー用のパーシャルであり、form_forを使ってRelationshipモデルオブジェクトを操作し、PostリクエストでRelationshipコントローラに、現在表示しているプロフィールのユーザーのuser.idをfollowed_idとして送信する)
 つぎにAjaxのリクエストを受け取るコントローラー側に変更を加えていく。

app/controllers/relationships_controller.rb
class RelationshipsController < ApplicationController
  before_action :logged_in_user

  def create
    @user = User.find(params[:followed_id])
    current_user.follow(@user)
    respond_to do |format|
      format.html { redirect_to @user }
      format.js
    end
  end



end

そして、、、、

 また、Ajaxを使用することで、webページ上でユーザーをfollowないしunfollowした際に、ページを移動することなくフォローに関するリクエストをサーバーに送信することができる。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?