1

Rails を学習するための小さなブログ アプリを作成しています。ユーザーはログインし、投稿を作成し、他のユーザーの投稿にコメントできます。現在、「コメントを追加」ページに Ajax を追加していますが、途中で設計上の問題が発生しました。ページ フローは次のようになります。

# post section
 :post.title here
 :post.username here
 :post.created_at here
 :post.body here

# comments section (sorted by date of creation):
:number of comments here

:first comment
:second comment
...
:last comment

# add comment section
:text_area here
:submit button here

問題点：

1 - コメントは作成日順にソートされるため、ajax 呼び出しによって新しいコメントがページの上部に追加されます。並べ替えの動作を変更すると、ajax コードが壊れます。

2 - コメントdivには、.odd、.even、または .admin の 3 つの css クラスを含めることができます (コメントが管理者ユーザーによって作成された場合は、奇数/偶数サイクルまたは管理者を適用します)。現在、これらのクラス名をハードコーディングし、if を使用して正しい名前を取得しています。これも悪いです。css クラス名を変更すると、ajax コードが壊れます。

どうすればこれらのことを回避できますか、または少なくとも改善できますか? これが私のcreate.js.erbです：

var div = $('#comments_div');
var comment_class = div.children().first().attr('class')
var new_class;

<% if current_user.admin == 1 %>
    new_class = 'comment_body_admin'
<% else %>
if (comment_class === 'comment_body_odd')
    new_class = 'comment_body_even'
else
    new_class = 'comment_body_odd'
<% end %>

var new_div = $('#comments_div').prepend("<%= j render @comment %>");
new_div.children().first().attr('class', new_class)

助けてくれてありがとう！

4

1 に答える 1

0

1 - 作成時の順序を逆にする以外に、コメントの並べ替えをどのように変更しますか? その場合、create.js.erb にソート順を認識させ、先頭の代わりに追加を使用する必要があります。

2 - 管理者には「admin」クラスを適用しますが、偶奇ストライピングは CSS に任せます。このようなものはそれを行うべきです:

.comment:nth-child(2n) { background: #eeeeee; }

また、DOM に挿入する前に、ノードを作成してその属性を操作する方が効率的です。

var comment = $("<%= j render @comment %>").addClass('comment')
comment.addClass(new_class)
$('#comments_div').prepend(comment)
于 2013-06-12T16:15:04.937 に答える