Master Detail Page - View

index.html.erb

<div class="container">
  <div class="header">
    Header - <a href="/products/">Product List</a>
  </div>
  <div id="product_details" style="display: none">
    <% if @product.present? %>
      <%= render file: 'products/product' %>
    <% end %>
  </div>
  <ul class="products" id="product_list" style="display: none">
    <% @products.each do |product| %>
      <li>
        <a href="/products/<%=product.id%>">
          <img src="<%= product.image_url%>"/>
          <div>
            <%= product.name %>
          </div>
        </a>
      </li>
    <% end %>
  </ul>
</div>

<script type="text/javascript">
  $(document).ready(function() {
    window.app = new ProductRouter();
  });
</script>