ajax - 如何使用 ajax 请求更新上下文处理器变量，而不刷新页面

Question

目前正在显示新通知的标题上的通知计数，它们有 is_read = False，我想更新 is_read = True 并删除通知计数，这就是我正在做的

上下文处理器

  def notification(request):
      """Provide the count of unread notifications for an authenticated user."""
      if request.user.is_authenticated():
          notifications = Notification.objects.filter(user=request.user, is_read=False).\
                              order_by('-created')[:5]
      return {'notification_count': len(notifications),
            'notifications': notifications}
      else:
           return {}

html模板和ajax调用

{% if notification_count >= 1 %}
      <a id="notification_menu" data-toggle="dropdown" class="dropdown-toggle" href="#">
           <i class="ace-icon fa fa-bell icon-animated-bell"></i>
           <span class="badge badge-important">{{ payzaat_notification_count }}</span>
      </a>
 {% endif %}

<script type="text/javascript">
    (function($){
        $('#notification_menu').on("click",function(){
            console.log('clicked');
            $.ajax({
                    type: "GET",
                    url: "{% url 'parent:update_notification' %}",
                    dataType: 'json',
                    success: function(response){
                        return true;
                    },error:function(response){
                        return false;
                    }
                });
        });
    })(jQuery);
</script>

更新视图

类更新通知（FormView）：

@method_decorator(parent_required)
def dispatch(self, request, *args, **kwargs):
    return super(UpdateNotification, self).dispatch(request, *args, **kwargs)

def get(self, request, *args, **kwargs):
    for record in Notification.objects.filter(user=self.request.user, is_read=False):
        record.is_read = True
        record.save()
    return HttpResponse("OKAY")

我的模型已更新，但模板仍显示计数，直到我刷新页面

Answer 1

谢谢尼玛

由于上下文处理器在页面渲染上运行，所以我已经这样做了

success: function(response) {
    $(this + ".badge .badge-important").html("");
}

Answer 2

您必须清除 ajax 成功的通知计数：

success: function(response) {
    $("#notification_menu span").text("");
}