title: How do I link to data in a partial that's rendered through Ajax?
body: <p>I'm rendering a product catalog using AJAX. Collections have subcategories whose products are rendered as AJAX partials. I tried to link to those pages from other parts of the site through regular links (without remote:true) and obviously, it didn't work since the show action in my subcategories controller was only responding to js.</p>
  
  <p>I tried to solve it by adding format.html to the subcategories controller and creating a show.html.erb file, in addition to the _show.html.erb and show.js.erb. The subcategories/show is exactly the same as collections/show and the AJAX links all work fine. But it's rendering other subcategories partials from the one URL which looks confusing, and it's also repeating a lot of code. </p>
  
  <p>Is there a way I can link to the collection page from other parts of the site and render the correct subcategories partial? What is the best way to handle this kind of situation?</p>
  
  <p>subcategories_controller.rb</p>
  
  <pre><code>def show
    @subcategory = Subcategory.friendly.find(params[:id])
    @collection = @subcategory.collection
  
    respond_to do |format|
      format.js
      format.html
    end
  end
  </code></pre>
  
  <p>collections/show.html.erb</p>
  
  <pre><code>&lt;% @collection.subcategories.each do |subcategory| %&gt;
      &lt;%= link_to subcategory.name, [collection, subcategory], remote: true %&gt;
  &lt;% end %&gt;
  
  &lt;div class="product-grid"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>subcategories/show.js.erb</p>
  
  <pre><code>document.querySelector(".product-grid").innerHTML = "&lt;%= escape_javascript(render partial: 'show', locals: { subcategory: @subcategory } ) %&gt;";
  </code></pre>
  
  <p>subcategories/show.html.erb</p>
  
  <pre><code>&lt;!-- same as collections/show.html.erb !--&gt;
  </code></pre>