質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Ruby on Rails 5

Ruby on Rails 5は、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

Ruby

Rubyはプログラミング言語のひとつで、オープンソース、オブジェクト指向のプログラミング開発に対応しています。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

Q&A

1回答

656閲覧

Ruby-on-railsでビューページの変数を動的に変更したい。ユーザー一覧ページをカルーセルのように一覧できるようにしたい。

okodoon

総合スコア10

Ruby on Rails 5

Ruby on Rails 5は、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

Ruby

Rubyはプログラミング言語のひとつで、オープンソース、オブジェクト指向のプログラミング開発に対応しています。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

0グッド

0クリップ

投稿2018/10/24 10:51

前提・実現したいこと

ruby on railsでユーザーの存在するアプリケーションを作っております。
ユーザー一覧ページを動的に、スライドにより表示できるようにしたいです。
言葉では説明し難いので画像付きで状況を説明します。
イメージ説明
上図のようにユーザーが順番に横に並んでおり、真ん中のユーザーだけ詳細な情報(今回は名前)が表示されます。
右の人をクリックしたら全員右にスライドし、左側にいた人が中心となります。左側の人をクリックしたら全体が左にずれて右側の人が真ん中になるようにしたいです。

スライドさせるためのアニメーション周りのコードは質問したいこととズレているため省略しております。

該当のソースコード

Usersコントローラーのindexアクションはこんな感じです。

ruby

1 def index 2 @users = User.all 3 @x = current_user.id 4 end

usersコントローラーのビューのindex.html.erbは次のようになっています。
(show_avatorというメソッドはそのユーザーのアバター画像を表示する自作メソッドです。)

erb

1 <% @users.each_with_index do |user, i| %> 2 3 <% case i when @x-1 %> 4 <%= show_avator(user) %> 5 <% when @x %> 6 <%= show_avator(user) %> 7 <h3><%= link_to user.name, (user_path(user.id)) %></h3> 8 <% if user.admin? %> 9 <h3 style="color: red">Guild Master </h3> 10 <% end %> 11 <% when @x+1 %> 12 <%= link_to show_avator(user),"/users/next",remote:true %> 13 <% end %> 14 15 <% end %>

試したこと

真ん中に表示する人のインデックス番号を変更すれば真ん中に表示される人が変わるので、
今回の場合だと@xを動的に変化させればいいのではないかと考えました。

ruby

1 def next 2 @x += 1 3 end

動的に変化させることなのでajaxを使おうと考えました。
そこでusersコントローラーに上記のようなnextアクションを作り、右の人をクリックした時にnextアクションに飛び変数を変更するようなlink_toを作りました。

しかし、ajaxに対する理解はとても浅く、うまく動きません。どのようにしたら良いでしょうか。

補足情報(FW/ツールのバージョンなど)

rails 5

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

う~ん、よくわからないですが・・。

まずajaxの部分ですが、

<%= link_to show_avator(user),"/users/next",remote:true %>

これでクリックした後、下記のアクションまできていますか?

def next @x += 1 end

そして、@xに+1してますが
def next
end
で+1する直前の@xの値は、何が入ってますか?

※ソース見る限りだと値が何も入ってないのかも?って思ってます。

投稿2018/11/05 08:43

dobby618

総合スコア302

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問