Question

这让我很难过，现在我已经盯着屏幕看了很长时间它是关于我正在努力开发的邮件应用程序。我有一个HTML页面，分为三个部分。左侧可以选中/取消选中用于查看电子邮件的文件夹。中间页面“应该”显示所有邮件（取决于左栏中选择的内容）。最右边的列是中间单个邮件的扩展视图。我添加了AJAX GET请求功能来传递以查看已选择或未选择的文件夹。该视图可以获得AJAX请求（在下面的代码中我打印出args，这是我想要的）。然而，HTML页面/模板永远不会响应变化的args !!我不知道为什么？请帮我找一下程序中的错误。

urls.py

from django.conf.urls import url
from . import views


app_name="Home"
urlpatterns = [
    url(r'^$', views.Home_View.as_view(),name="Home"),
    url(r'^RightBody/$', views.RightBody, name="RightBody"),
    url(r'^RulePopUp/$', views.RulePopUp_View.as_view(), name="RulePopUp"),
    ]

views.py

class Home_View(View):

    def get(self, request):
        ExcludedFolder = request.GET.getlist('UncheckedFolder[]')
        LeftSide_FolderHandle = FolderTree("/SomePath/")
        LeftSide_Folder = LeftSide_FolderHandle.CreateFolderNames()
        LeftSide_Folder = LeftSide_FolderHandle.MakeAJSONtree()
        CompleteMailBox_Handle = MailLogger("/SomePath/",FoldersToExclude=ExcludedFolder)
        CompleteMailBox = CompleteMailBox_Handle.RecreateMailBox()
        # RightMail = FullMailInTheRight()
        args = {"CompleteMailBox":CompleteMailBox,
                "LeftSide_FolderStructure":LeftSide_Folder}
        print(args) ##This works
        return render(request,'Home_Query.html',args)

Home_Query.html

<!DOCTYPE html>
{% load static %}
<html>
  <head>
    <meta charset="utf-8">
    <title>Main Page</title>
    <script type="text/javascript" src="{% static 'js/jquery-3.2.1.js' %}"></script>
    <link rel="stylesheet" href="{% static 'css/HomePageMain.css' %}" type="text/css">
  </head>
  <body>
    <h1 class="Headline"> Mail checking app </h1>
    <br>
    <br>
    <div class="left-column">
      Select folders to display messages
      <br>
      <br>
{% include "Home_Query_LeftSide.html" with LeftSide_FolderStructure=LeftSide_FolderStructure %}
    </div>
    <div class="middle-column">
      Select Message to show complete mail on the right
      <br>
      <br>
      {% for eachMail in CompleteMailBox %}
        <div class="SingleMail">
            <span class="EachMailSender"> Sender: </span> <span class="MailSender">{{eachMail.0.Sender}}</span>, <span class="EachMailTime">Time: </span> <span class="MailTime">{{eachMail.0.Time}}</span> <br>
            <span class="EachMailSubject">Subject: </span> <span class="Subject">{{eachMail.0.Subject}}</span><br>
            <span class="EachMailBody"> Mail: </span>{{eachMail.1}}
            <div class="Rules">
              <p id="Rules">Click here for rules</p>
            </div>
        </div>
    {% endfor %}
    </div>
    <div class="right-column">
      This column shows the complete email when selected in the middle column
      <br>
      <br>
      <div class="FullMail">
      </div>
      <br>
      <br>
    </div>
  </body>
    <script type="text/javascript" src="{% static 'js/main.js' %}"></script>
</html>

main.js

var Unchecked = [];

$(function () {
    $("input:checkbox").click(function(){
      $(this).parent().find("input[type='checkbox']").prop('checked',$(this).is(':checked'));
      if ($(".left-column").find("input:checkbox:not(:checked)").length != 0){
        var UncheckedFolder = "";
        $(this).parent().find("input:checkbox:not(:checked)").each(function(){
          UncheckedFolder += "/"+String($(this).prop("id"));
        });
        if ($.inArray(UncheckedFolder, Unchecked) === -1) {Unchecked.push(UncheckedFolder)}
        var CheckedFolder = "";
        $(this).parent().find("input:checkbox:checked").each(function(){
          CheckedFolder += "/"+String($(this).prop("id"));
        });
        if ($.inArray(CheckedFolder, Unchecked) != -1) {Unchecked.splice($.inArray(CheckedFolder,Unchecked),1);}
        UncheckedFolder = "";
      }
      else {
        Unchecked = [];
      }
      console.log(Unchecked);
      $.ajax({
        type: 'get',
        url: "/Home/",
        datatype: "json",
        data: {
          'UncheckedFolder':Unchecked,
        },
        success: PrintMessage,
      });
    });
});

function PrintMessage(data,textStatus,jqXHR){
  console.log("Success To Exclude");
}

非常感谢！

Answer 1

你很亲密。返回JsonResponse而不是render:

from django.http import JsonResponse

class Home_View(View):

    def get(self, request):
        ...
        print(args) ##This works
        return JsonResponse(args)

javascript调用期望以json格式响应。使用render，您将返回HTML模板。

AJAX GET请求成功; Django View已更新，但HTML未更新

1 个答案: