Question

I need to create a ‘Reply’ button that shows a form for any item in a feed. In other words, it can’t be showing/hiding something with a unique div id, because it has to work for any of a (potentially) infinite number of items.

If I use code like this:

<% @questions.each do |question| %>
  <%= question.content %>
  <a href="" onclick="showStuff('reply'); return false;">Reply</a>
  <div id="reply">
    <% form_for @reply do |f| %>
      <%= f.text_field :message %>
      <%= f.submit "Add", :class => "button" %>
    <% end %>
  </div>
  <% end %>

then the form only opens for the first item in the feed.

I don’t know Javascript at all and not much JQuery

Answer 1

As you are generating multiple elements, you shouldn’t give them an id, because each id should be unique.

Instead, locate the div by searching relative to the link that was clicked on.

<% @questions.each do |question| %> 
    <%= question.content %> 
    <a href="" onclick="showStuff(this); return false;">Reply</a> 
    <div> 
       <% form_for @reply do |f| %> 
           <%= f.text_field :message %> 
           <%= f.submit "Add", :class => "button" %> 
       <% end %> 
    </div> 
<% end %> 
.
.
.
function showStuff(link){
   $link).next().show();
}