如何製作無限多線程註釋

Question

我目前的代碼允許我呈現Comments（父註釋）的查詢集以及對這些註釋的回覆。但我無法回覆這些回覆。我的目標是有一個無限的回覆系統。這裏是我的代碼：

class Comment(models.Model): 
    user = models.ForeignKey(User, blank=True, null=True) 
    destination = models.CharField(default='1', max_length=12, blank=True) 
    parent_id = models.IntegerField(default=0) 
    parent_comment = models.ForeignKey('self', related_name='replies', related_query_name='replies', blank=True, null=True) 
    comment_text = models.TextField(max_length=350, blank=True, null=True) 
    timestamp = models.DateTimeField(default=timezone.now, blank=True) 
    children = models.IntegerField(default=0) 

    def __str__(self): 
     return str(self.comment_text) 

我父評論觀點：

def user_comment(request): 
    if request.is_ajax(): 
     comment = CommentForm(request.POST or None) 
     ajax_comment = request.POST.get('text') 
     id = request.POST.get('id') 
     comment_length = len(str(ajax_comment)) 
     if comment.is_valid() and request.user.is_authenticated: 
      comment = Comment.objects.create(comment_text=ajax_comment, destination=id, user=request.user) 
      username = str(request.user) 
      return JsonResponse({'text': ajax_comment, 'text_length': comment_length, 
           'username': username, 'id': comment.id}) 
     else: 
      return HttpResponse() 

和我回複查看：

def comment_reply(request): 
    if request.is_ajax(): 
     comment = CommentForm(request.POST or None) 
     reply_text = request.POST.get('reply_text') 
     id = request.POST.get('id') 
     parent_id = request.POST.get('parent_id') 
     parent = Comment.objects.get(id=parent_id) 
     parent.children += 1 
     parent.save() 
     if comment.is_valid() and request.user.is_authenticated: 
      comment = Comment.objects.create(comment_text=reply_text, destination=id, user=request.user, parent_id=parent_id, parent_comment=parent) 
      username = str(request.user) 
      return JsonResponse({'reply_text': reply_text, 'username': username}) 
     else: 
      return HttpResponse() 

AJAX調用

var str = window.location.href.split('?')[0]; 
var path = str.split("/")[4]; 

$('.comment_form').on('submit', function(e) { 
e.preventDefault(); 

var c = $(this).find('.comment_text').val() 
    console.log('this:', c); 

$.ajax({ 
    type: 'POST', 
    url: '/user_comment/', 
    data: { 
     text: $(this).find('.comment_text').val(), 
     id: path, 
     csrfmiddlewaretoken: $("input[name='csrfmiddlewaretoken']").val(), 
}, 
    success: function(data) { 
     if(data.text == '') { 
      console.log('Cannot submit blank comment'); 
     } else { 
      //console.log('') 
      $('.commentsContainer hr').prepend("<div class='comment_div'><div class='left_comment_div'>" + 
       "<div class='username_and_votes'><h3><a class='username_foreign'>" + data.username + 
       "</a></h3></div><br><p>" + data.text + 
       "</p></div></div>"); 
     }} 

}); 

}); 

// reply comment 

    $(document).on('submit', '.reply_comment_form', function(e) { 
     e.preventDefault(); 
     parent_id = $('.reply_comment_form').data('comment_id'); 

     $.ajax({ 
      type: 'POST', 
      url: '/comment_reply/', 
      data: { 
       reply_text: $(this).find('.comment_text').val(), 
       parent_id: parent_id, 
       id: path, 
       csrfmiddlewaretoken: $("input[name='csrfmiddlewaretoken']").val(), 
      }, 
      success: function(data) { 
       $('.reply_comment_form').replaceWith("<div class='comment_div new_comment' style='display: inline-block;'><div class='left_comment_div'>" + 
       "<div class='username_and_votes'><h3><a href='#' class='username_foreign'>" + data.username + 
       "</a></h3><br><p>" + data.reply_text + 
       "</p></div></div>"); 

      } 

     }); 


    }); 

和評論的HTML

<div class="commentsContainer"> 

    <form action="" class="comment_form">{% csrf_token %} 
     {{ comment.comment_text|add_class:"comment_text" }} 
     {{ comment.id }} 

     <input type="submit" value="Comment" class="comment_submit"> 
    </form> 
    <hr> 
    {% for i in comment_list %} 
     <div class='comment_div' data-comment_id="{{ i.id }}"> 
      <div class="left_comment_div"> 
       <div class="username_and_votes"> 
        <h3><a class='username_foreign'>{{ i.user }}</a></h3> 
       </div> 
       <br> 
       <p>{{ i.comment_text }}</p> 
      </div> 
     </div> 
     {% for reply in i.replies.all %} 
      <div class='comment_div new_comment' data-comment_id="{{ reply.id }}"> 
      <div class="left_comment_div"> 
       <div class="username_and_votes"> 
        <h3><a class='username_foreign'>{{ reply.user }}</a></h3> 
       </div> 
       <br> 
       <p>{{ reply.comment_text }}</p> 
      </div> 
     </div> 
     {% endfor %} 
    {% endfor %} 
</div> 

如果有人可以給我建議如何實現代碼的無盡回覆我目前有這將是偉大的。

Answer 1

你需要把你的意見循環到一個單獨的模板

{% for i in comments %} 
    <div class='comment_div' data-comment_id="{{ i.id }}"> 
     <div class="left_comment_div"> 
      <div class="username_and_votes"> 
       <h3><a class='username_foreign'>{{ i.user }}</a></h3> 
      </div> 
      <br> 
      <p>{{ i.comment_text }}</p> 
     </div> 
    </div> 
    {% include 'comments_template.html' with comments=i.replies.all %} 
{% endfor %} 

然後你只需要調用這個地方你

{% include 'comments_template.html' with comments=comment_list %}