リフレッシュせずにコメントを表示

Question

彼は投稿した直後にコメント投稿を表示したいと思います。私は既にコメントをアップロードしました。どうやってユーザーに表示できますか？

$(".comments input[name='post']").keydown(function (evt) { 
    var keyCode = evt.which?evt.which:evt.keyCode; 
    if (keyCode == 13) { 
     var form = $(this).closest("form"); 
     var container = $(this).closest(".comments"); 
     var input = $(this); 
     $.ajax({ 
     url: "{% url 'comment' letnik_id=letnik_id classes_id=classes_id subject_id=subject_id %}", 
     data: $(form).serialize(), 
     type: 'post', 
     cache: false, 
     beforeSend: function() { 
      $(input).val(""); 
      $(input).blur(); 
     }, 
     success: function (data) { 
      alert("Successful comment"); 
      $(input).val(""); 
      $(input).blur(); 
     } 
     }); 
    } 
    }); 

この記事のコメント：私はこのAjaxコードを持っています。 views.pyでは、私はコメント割引：なしまた

def comment(request, letnik_id, classes_id, subject_id): 
try: 
    if request.method == 'POST': 
     exam_id = request.POST.get('exam_id') 
     exam = get_object_or_404(Exam, id=exam_id) 
     comment = request.POST.get('post') 
     comment = comment.strip() 
     if len(comment) > 0: 
      instance = ExamComment(
       exam=exam, 
       comment=comment, 
       comment_user=request.user) 
      instance.save() 
      return redirect('subject_id', letnik_id=letnik_id, classes_id=classes_id, subject_id=subject_id) 
     html = '' 
     for comment in exam.get_comments(): 
      html = '{0}{1}'.format(html, render_to_string('exam_partial_comment.html', {'comment': comment})) 
     return HttpResponse(html) 
    else: 
     return HttpResponseBadRequest() 
except Exception: 
    return HttpResponseBadRequest() 

：return redirect('subject_id', letnik_id=letnik_id, classes_id=classes_id, subject_id=subject_id) このコードを、あなたの代わりのHttpResponseのJsonResponse機能を必要とする...

Answer 1

まず私がerror400になるだろうと私は成功アラートを取得wouldn`t 。この方法では、そこには、レンダリング関与はありません、あなたが戻ってあなたのテンプレートに新しい（古い）コメントを返す

from django.http import JsonResponse 
if request.method == 'POST': 
    #... 
    if len(comment) > 0: 
     #...saving... 
    comments = ExamComment.objects.filter(exams=exams, comment_user=request.user) 
    newcomments = {comments:[]} 
    for comment in comments: 
     newcomments[comments].append(comment) 
    return JsonResponse(newcomments) 
else: 
    return HttpResponseBadRequest() 

：JsonResponseで、あなただけの、あなたがあなたのページに更新したいコメントのようなものを辞書オブジェクトを渡します。それだ

success: function (data) { 
     alert("Successful comment"); 
     $(input).val(""); 
     $(input).blur(); 
     var div = document.getElementById('yourCommentDivName'); 
     newcomments = '' 
     for(i;i<data.comments.length;i++){ 
     newcomments = newcomments + '<p>' + data.comments[i] + '</p>' 
     } 
     div.innerHTML = div.innerHTML + newcomments; 
    } 

まあ：次のあなたは、Ajaxの成功の後に（私は名前を知らない）あなたのコメントのdivを再構築する必要があります。コメント：コードはテストされていません。あなたがこのようなことをたくさんしている場合は、反応として、これをボックスの外で行ういくつかのjavascriptライブラリを調べる必要があります。急な学習曲線ですが、一度理解すればそれは人生の節約になります。最後のことは、まあ、ものを除いてこの試しを避けることです。これはデバッグを難しくし、長期的にはあなたの健康に悪いことです。あなたが本当に持っている必要がある場合にのみこれを行います。私はそうではないと思います。

希望すると助かります！