render show page inside index page, how to put a different id on each modal

Question

I am using a Modal to pop up the show page inside the index page.....Everything works just fine until I click on a product. For some reason, the same name is popping up for every product on the modal

I know it's an easy fix, please help....new to rails This is my code:

Views

_show.html.erb

<div id="myModal" class="modal hide fade" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="content-inner hero-unit">
    <h1 class="pump-up center">
      <br>
      <strong>Coming Soon.</strong></h1>
      <br><br>
      <p>
        <b>Name: </b>
        **<%= @product.name %>**
      </p>
  </div>
</div>

index.html.erb

<div class="row">
  <% @products.each do |product| %>
      <div class="span3">

      <%= render :partial => 'products/show', :locals => { :product => product }  %>
        <a href="#myModal" role="button" data-toggle="modal">
        <%=(image_tag product.photo(:medium))%></a>

      </div>
  <% end %>
</div>

Model

product.rb

class Product < ActiveRecord::Base
  attr_accessible :name, :photo
end

Controller

products_controller.rb

class ProductsController < ApplicationController

  def show
    @product = Product.find(params[:id])
  end


  def index
    @products = Product.all
  end

end

Answer 1

Ok The issue is with this code.

In Index.html.erb

It should be

<a href="#myModal<%=product.id %>" role="button" data-toggle="modal">

And Change ur _show.html.erb to this

<div id="myModal<%=product.id%>" class="modal hide fade" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">

This should do the JOB.

Also I see that you are not using the local variable that is passed from index action. you are using @product which may be an issue, try using just 'product' that is being passed from the index.html.erb