На ваш вопрос нет хорошего ответа - все это в значительной степени зависит от расположения вашего приложения. Кроме того, есть достоверные ответы здесь о to_param и использовании AJAX, которые добавляют важные детали. Но, чтобы дать вам начало.
Для ваших мнений/Фоос, переписать index.html.erb как:
<%= render partial: "show_foos", locals: { foos: @foos, selected_foo: nil }%>
И ваш show.html.erb как:
<%= render partial: "show_foos", locals: { foos: @foos, selected_foo: @foo }%>
В вашем foos_controller.rb в шоу-метод вам необходимо получить как @foos, так и @foo, например:
@foos = Foo.all
@foo = Foo.find(params[:id])
Теперь, к интересной части. Назад в каталог views/foos. Создайте частичное имя «_show_foos.erb» (тот, который мы назвали как из #index, так и из #show). Сделайте что-то вроде:
<table>
<tr>
<td>
<%= render partial: "show_foos_list", locals: { foos: foos, selected_foo: selected_foo }%>
</td>
<td>
<%= render partial: "show_foo_props", locals: { selected_foo: selected_foo }%>
</td>
</tr>
</table>
Пожалуйста, обратите внимание, что это чрезвычайно грубой & некрасиво пример, который создает таблицу с двумя столбцами: один для списка Фоос в левой «панели», а другой для отображения результатов для выбранного foos в правой панели. В реальной жизни используйте divs и styling. Кроме того, подумайте о том, чтобы направить макет туда, где он находится, в соответствующий файл макета, и использовать там именованные уроки. Но, как я уже сказал, головной убор - простой стол.
Теперь просто определите две части, упомянутые здесь. Во-первых, «_show_foos_list.erb», в котором перечислены foos слева. Предположим, что каждый Foo имеет 'название' атрибут, что-то вроде:
<% foos.each do |foo| %>
<%= link_to_unless selected_foo && (foo.id == selected_foo.id), foo.title, foo %><br />
<% end %>
Во-вторых, Foo & foo_bars справа - "_show_foo_props.erb":
<% if selected_foo %>
# Here display the Foo attributes
<h2> Foo: <%= selected_foo.title %> </h2>
<% selected_foo.foo_bars.each do |foo_bar| %>
# Here display each FooBar that belongs to Foo
<h3>FooBar <%= foo_bar.title %></h3>
<%= foo_bar.description %>
<% end %>
<% end %>
Опять же, очень грубый пример. Замените «title», «description» на нужные наборы параметров, используйте частичные для отображения FooBars. Сделайте стиль с помощью CSS. Etc и т. Д., ... Рефтор, как вы считаете нужным.
Говоря о маршрутах. То, что вы получаете, это когда вы переходите на ваш «www.yourapp.com/foos», url - это список всех фосов слева, ничего справа. Как только вы нажмете на любом foo в левом столбце, перейдите к «www.yourapp.com/foos/:id», где: id - это идентификатор выбранного foo (и рассмотрите to_param из другого ответа здесь или более продвинутых методов чтобы сделать эту часть значимой) и получить список foos слева, а также свойства выбранного foo и всех foo_bars, принадлежащих ему справа.
Надеюсь, что это поможет приступить к разработке собственной реализации на основе предлагаемой здесь приблизительной идеи.