Bootstrap Modal with Jquery on Rails 6

I have a list of items in the index page, and I added a button on every product, so the show action, instead of going to a show page opens a modal with the show info.

For that, I created a partial to render the show info, but the modal is not loading. In the console the error is pointing to the show.erb file and not the render.

This is my index page:

<tbody>
  <% @shopifyproducts.each do |shopifyproduct| %>
    <tr>
      <td><img height=75 src=<%= shopifyproduct.image %>  /></td>
      <td><%= shopifyproduct.sku %></td>
      <td><%= shopifyproduct.title %></td>
      <td>$ <%= shopifyproduct.price %></td>
      <td><span>
        <input class="form" type="text" name="dwtoys" form="myform" value=<%=shopifyproduct.inventory.to_i%> />
          <%= link_to 'Add', shopifyproduct,  {:remote => true, 'data-toggle' =>  "modal", 'data-target' =>
         '#exampleModal', class: 'btn btn-primary btn-lg'}  %>         
      </td>

      <td><%= link_to 'Show', shopifyproduct %></td>
      <td><%= link_to 'Edit', edit_shopifyproduct_path(shopifyproduct) %></td>
      <td><%= link_to 'Destroy', shopifyproduct, method: :delete, data: { confirm: 'Are you sure?' } %></td>
    </tr>
  <% end %>
</tbody>

This is my _show.html.erb page

<!-- Modal -->
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLabel">Modal title</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <%= @shopifyproduct.title %>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>

This is my show controller:

def show
  respond_to do |format|
    format.html
    format.js
  end
end

And finally this is the application.js file:

$("#myModal").find(".modal-content").html("<%= j (render 'show') %>");
$('#myModal').on('shown.bs.modal', function () {
    $('#myInput').trigger('focus')

If instead of using the render, I add the modal to the index page, it works, but no matter which product I click, it always displays the info of the first product. Thats why I'm trying to render into a partial with the data of that product only.