Как показать обновленную дату после вызова ajax в Django

Question

Я пытаюсь реализовать раздел обзора в моем приложении Django. Ниже приведен мой исходный код для публикации и просмотра отзывов о магазине. Я уже закончил создание отзыва с помощью Ajax, но не могу понять, как показать вновь созданный отзыв после вызова Ajax.

Подобно тому, как кнопка «лайк» работает в социальных сетях, я могу легко обновить кнопку «лайк», основываясь на ответе на вызов Ajax, изменив attr() или html(). Но, это не относится к этому случаю обзора, так как он показывает отзывы магазина для зацикливания. Поэтому я чувствую, что должен выяснить, как снова запустить цикл for после вызова Ajax.

Кто-нибудь делал это раньше?

HTML

<div class="review-new">
  <div class="my-rating" name="rating"></div>    
  <textarea class="form-control" rows="5" id="ratingTextarea"></textarea>
  <input class="global-btn" stlye="float:right" type="button" value="Submit" id="review-submit"
  data-url="{% url 'boutique:post-review-api' store.domainKey %}" data-store-id="{{ store.id }}">
</div>

...

{% for i in store.review_set.all %}
  ...
{% endfor %}

views.py

class ReviewPost(APIView):
    permission_classes = (permissions.AllowAny,)

    def post(self, request, store_domainKey=None, format=None):

        rating = request.data['rating']
        content = request.data['content']
        store_id = request.data['storeId']
        store = Store.objects.get(id=store_id)

        new_review = Review()
        new_review.store = store
        new_review.review_score = rating
        new_review.content = content
        new_review.created_by = request.user
        new_review.save()

        reviews = store.review_set.all()
        data = {
            'reviews': reviews
        }
        return Response(data)

ajax.js

$(document).on("click", "#review-submit", function(e) {
    e.preventDefault();
    var _this = $(this);
    var url = _this.attr("data-url");
    var rating = _this.attr("data-rating");
    var storeId = _this.attr("data-store-id");
    var content = $("#ratingTextarea")[0].value;

    $.ajax({
      url: url,
      method: "POST",
      data: {
        csrfmiddlewaretoken: $("input[name=csrfmiddlewaretoken]").val(),
        rating: rating,
        content: content,
        storeId: storeId
      },
      success: function(res) {
        console.log(res);
      },
      error: function(error) {
        console.log(error);
      }
    });
  });

Answer 1

Вы можете выделить свой цикл отзывов в отдельном шаблоне:

reviews.html

{% for i in store.review_set.all %}
  ...
{% endfor %}

В вашем HTML :

{% include "reviews.html" %}

В вашем views.py вы можете выполнить повторную визуализацию и вернуть шаблон отзывов в формате HTML:

import json
from django.template import loader
from django.shortcuts import HttpResponse
...
reviews_html = loader.render_to_string('reviews.html', context={'store': store})
return HttpResponse(json.dumps({'reviews_html': reviews_html}))

Затем, в вашем Ajax методе успеха:

  success: function(json) {
      // change your reviews div HTML to json['reviews_html'];
  }