Question

在我的应用中，我有一个模型＆＃39;评论＆＃39;可以提交问题，答案，解决方案或其他评论。

问题是，因为表单是部分的，并且应用程序使用Jquery切换来显示/隐藏表单，当它在页面上多次出现时（因为问题有答案，答案有注释，所以可以有＆gt; =页面上的3个评论表格），按一个“添加评论”＃39;更改所有“添加评论”＃39;链接到＆＃39;取消＆＃39;在页面上，反之亦然。我该如何避免这种情况？

_comment.html.erb：

<li class="media comment comment-<%= comment.id %>">

  <%= render partial: "evaluations/vote_wrapper", locals: {voteable: comment} %>

  <div class="media-body">
    <div class="media-item-body">
      <strong>
        <%= render comment.user %>
      </strong>
       <br />
      <%= comment.brief %>
    </div>
    <% unless comment.commentable_type == 'Comment' then %>
      <ul class="media-list comments comment-comments">
        <% if comment.comments.count > 0 %>
        <%= render vote_order(comment.comments.includes(:user)) %>
        <% end %>
      </ul>
      <p class="reply comment">
        <%= link_to "Reply to comment", new_comment_comment_path(comment), remote: true %>
      </p>
      <p class="cancel reply" style="display:none">
        <%= link_to "Cancel", new_comment_comment_path(comment), remote: true %>
      </p>
    <% end %>
  </div>
</li>

new.js.erb发表评论

var selector = ".<%= j @commentable.class.to_s.downcase + '-' + @commentable.id.to_s + '    .media-body ' %>"
selector2 = selector + ".<%= j @commentable.class.to_s.downcase %>-comments"

if($("p.add.comment").is(":visible")){ 
    if ($(selector2 + " .js-inline-form").length == 0) {
        $(selector2 )
        .append("<li class='js-inline-form'><%= j render :partial => 'comments/form' %></li>")
}
    else {
    $(selector2 + " .js-inline-form").remove()
    $(selector2) 
        .append("<li class='js-inline-form'><%= j render :partial => 'comments/form' %></li>")
    }
    $("p.add.comment").hide()
    $("p.cancel").show()
}
else if($("p.cancel").is(":visible")){
    $(selector2 + " li.js-inline-form").remove()
    $("p.cancel").hide()
    $("p.add.comment").show()
}
else if($("p.reply.comment").is(":visible")){ 
        if ($(selector2 + " .js-inline-form").length == 0) {
        $(selector2 )
        .append("<li class='js-inline-form'><%= j render :partial => 'comments/form' %></li>")
    }
    else {
        $(selector2 + " .js-inline-form").remove()
        $(selector2) 
        .append("<li class='js-inline-form'><%= j render :partial => 'comments/form' %></li>")
        }
        $("p.reply.comment").hide()
        $("p.cancel.reply").show()
}
else if($("p.cancel.reply").is(":visible")){
    $(selector2 + " li.js-inline-form").remove()
    $("p.cancel.reply").hide()
    $("p.reply.comment").show()
}

这些评论的_form部分：

<%= form_for(@comment, remote: true) do |f| %>
   .........
  <div class="field form-group">
    <%= f.label :brief %><br>
    <%= f.text_area :brief, class: "form-control" %>
    <% if user_signed_in? %>
    <%= hidden_field_tag :user_id, current_user.id %>
    <%= hidden_field_tag :commentable_id, @commentable.id %>
    <%= hidden_field_tag :commentable_type, @commentable.class %>
    <% end %>
  </div>
  <div class="actions">
    <%= f.submit 'Create Comment', :class => "btn btn-primary" %>
  </div>
<% end %>

comments_controller new行动：

def new
    @comment = @commentable.comments.new
    @comment.commentable_id = params[:commentable_id]
    render layout: "form_left"
end

并_answer.html.erb显示评论的使用位置：

 .....
 <p class="add comment">
    <%= link_to "Add comment", new_answer_comment_path(answer), remote: true %>
 </p>
 <p class="cancel" style="display:none">
    <%= link_to "Cancel", new_answer_comment_path(answer), remote: true %>
 </p>
</div>

如何使这些类具有唯一性，以便每次link_to点击只会实际打开相关的评论表单？

感谢。

Answer 1

课程的目的是重复使用，如果你想要独特，你可以使用ID。我建议你遵循以下模式。

:id => "Identifier_ModelName_Id"

o/p => "Identifier_Question_15"

这样你的id就不会与其他评论相冲突

切换HTML链接文字＆＃39;显示/隐藏＆＃39;显示/隐藏内联表单以供评论;创建唯一标识符，以便不是所有评论链接都在页面上更改？

1 个答案: