我如何单击一次link_仅打开一次局部视图？

Question

I have these files:

_comment.haml

%div.comment{ :id => "comment-#{comment.id}" }
    %hr
    - if current_user && current_user.id == comment.user_id || current_user && current_user.id == reel_user
        = link_to "×", comment_path(comment), :method => :delete, :remote => true, :confirm => "Are you sure you want to remove this comment?", :disable_with => "×", :class => 'close', :id => "delete_comment"
    %h4
        = comment.user.first_name
        %small= comment.updated_at
    %p= comment.body
    %p= link_to "Reply", reply_comment_path(comment), :method => :get, :remote => true

comments_controller.rb

def reply
    @comment = Comment.find(params[:id])
    @obj = Event.find(@comment.commentable_id)
    @div_id = "comment-#{@comment.id}"
    respond_to do |format|
      format.js
    end
end

reply.js.erb

$("<%= j render(:partial => 'reply', :locals => { :comment => Comment.build_from(@obj, current_user.id, ""), :parent_comment => @comment }) %>").insertAfter($('#<%= @div_id %>')).show('fast');

_reply.haml

.reply-form
= form_for comment, :remote => true do |f|
    = f.text_area :body, :input_html => { :rows => "2" }, :label => false
    = f.text_field :commentable_id, :as => :hidden, :value => comment.commentable_id
    = f.text_field :commentable_type, :as => :hidden, :value => comment.commentable_type
    = f.text_field :p_comment, :as => :hidden, :value => parent_comment.id
    = f.submit "Reply!", :class => "btn btn-primary", :disable_with => "Submitting…"

That's basically the flow of what happens if you click "Reply" in _comment.haml. If you click "Reply", then the partial from _reply.haml opens up underneath the _comment.haml partial. However, if you click "Reply" more than once it will continue opening more _reply partials. How can I make it so that it only opens the form once and if you click it again then nothing happens?

Also, how can I make it so that if there's comment 1 and 2 and the reply partial is open for comment 1, if you click "Reply" on comment 2, it will open up the reply partial for comment 2 and close the partial for comment 1. Thanks!

Answer 1

There's lots of ways to do this.

In reply.js.erb before rendering the form, first remove any existing forms on the page, this action should prevent multiple reply forms coming up, and close reply forms from another reply click.

this line goes at the top of reply.js.erb

$('.reply-form').remove();

One side-effect of this answer is that if a person starts filling in the reply form and then they click on "Reply" again before they submit the form, then what they've typed will be lost