如何在Django中单击submit从数据库中获取数据？

Question

我只需要在单击SUBMIT而不是页面加载时在HTML上获取数据库对象。我目前有一个AJAX脚本运行在同一个表单上，当单击submit时，它将在textbox中输入的文本返回到HTML中。我希望保留此功能，并添加一个新的数据检索功能。下面是我正在使用的一些代码片段：

视图.py

@csrf_exempt
def chat(request):
    resps   = Responses.objects.all()
    context = {'resps' : resps}
    return render(request, "chat.html", context)

url.py

path('chat/', views.chat,  name='chat'),

chat.html

<form id="testForm" name="test-form" class="test-form" action="" method="POST">{% csrf_token %}
  <input id="texting" name="texting" type="text" class="test-text" placeholder="Test here"/>
  <div class="footer">
    <input type="submit" value="SEND">
</form>
</div>
{% for r in resps %}
<div>
  <p>{{r.response}}</p>
</div>
{% endfor %}

................................................

<script type="text/javascript">
      $(document).on('submit','#testForm', function(e){
        e.preventDefault();

        $.ajax({
          type  : 'POST',
          url   : '/chat/',
          data  :{
            text : $('#texting').val(),
            csrfmiddlewaretoken: $('input[text=csrfmiddlewaretoken]').val()
          },
          success : function(){
            // alert("Done!");
            document.getElementById("userSpeaks").innerHTML = document.getElementById('texting').value;
          }
        });
      });
  </script>

任何帮助都将不胜感激。我只需要一种方法，在每次单击submit按钮时打印模型对象，而不是在页面加载时自动打印。提前谢谢

Answer 1

请换电话

csrfmiddlewaretoken: $('input[text=csrfmiddlewaretoken]').val()

到

csrfmiddlewaretoken: $('input[name=csrfmiddlewaretoken]').val()

Answer 2

因此，如果希望通过ajax发送querylist，则必须将其作为json对象发送

from django.http import JsonResponse
from django.core.serializers import serialize

@csrf_exempt
def chat(request):
    data = {
            'resps': serialize("json", Responses.objects.all())
        }
        
    return JsonResponse(data)

而你success会看起来像这样

success : function(data){
            // alert("Done!");
            resps = JSON.parse(data.resps);
            var htmldata=""
            for(var x in resps){
            htmldata+="<p>"+resps[x].fields.xyz+"</p>"
            }


            $("#userSpeaks").html(htmldata);
          }