将通过 Django 中的 ajax 发布的数据传递给 HTML

Question

我有一个通过 Ajax 提交的表单，并希望将处理后的数据传递到相同的 HTML 以进行数据输入。

不确定是否正确，我已将数据发布到 url /cat_select 并计划在同一 url 中获取 Python 处理的值，但我在获取数据时遇到问题。

下面是POST函数

def cat_select(request):
    cat_result=[]
    cat_selected=[]
    cat_name=['l2','l3']
    cat_selected=list(map(lambda x:request.POST.get(x, '').split(','), cat_name))
    cat_result=c_result(["US"],cat_selected) #list of tuples I want to get 
    print(cat_selected)
    print(cat_result)
    return JsonResponse({'cat':cat_result},safe=False)

当我为 cat_result 打开 /cat_select 时，我得到的是空列表，而不是 Python 控制台中打印的内容。如何访问处理后的值？

我想在网页上显示cat_result。我希望在提交表单然后返回后处理数据，但浏览器似乎在POST 之前使用以下代码处理GET 数据。

<form id="cat_select">{% csrf_token %} 
<input class="site" name="site" type="text">
<input class="l2" name="l2" id="l2" type="text" style="width:30%">
<input class="l3" name="l3" id="l3" type="text" style="width:50%">
<br>
<button class="btn btn-outline-success my-2 my-sm-0" type="submit" id="cat_submit">Submit</button>
</form>
<script type="text/javascript">
$(document).on('submit','#cat_select',function(e){
    e.preventDefault();
    $.ajax({
        type:'POST',
        url:'/cat_select',
        data:{
            l2:$('#l2').val(),
            l3:$('#l3').val(),
            csrfmiddlewaretoken: $('input[name=csrfmiddlewaretoken]').val()
        },
        success: function(){
            alert ("selected!")
        }
    });
      $.ajax({
                method:'GET',
                url:'/cat_select',
                success:function(data){
                    console.log(data);
                    alert ("Data back!")
                },
                error:function(data){
                    console.log('Error!');
                }
            });
});
</script>

如果需要使用第二个 URL 来处理数据，我该如何在 FBV 中执行此操作？谢谢。

（更新我没有使用 django 表单，因为输入是用 selectize.js 包装的。除了 django 表单还有其他方法吗？）

Answer 1

可以通过ajax POST请求的成功回调来访问数据：

success: function(response, status, XHR){
        var data = JSON.parse(response);
        console.log(data);
        console.log(data.cat);
    }

澄清一下，我认为您正在尝试从您的第二个 ajax 请求中访问数据，但您不能这样做，因为 http 请求是无状态，这意味着每个请求对前一个请求一无所知请求，而之前请求中定义的任何变量都会在新请求中被遗忘。

TLDR;你不需要第二个 ajax 调用。

Answer 2

从您的代码中，我了解到您正在尝试创建一个带有字段和提交按钮的表单。但老实说，我不知道你为什么不使用 Django 表单，因为它非常简单直接 Django forms

你不需要做你正在做的事情。除非您正在做其他可以解释的事情，否则我们可以提供帮助

我只在需要向同一页面发送多个发布请求时才执行您所做的操作，在该页面中，每次用户执行某项操作时我都需要更新一个变量 我的是当用户停止视频发布我在另一个脚本中处理的视频的当前第二个时，但是发送我需要的数据的脚本

///function that POSTS the remining time andd video id
function PostVideoData() {
    var newinput =     document.getElementById("remtime").value;
var video_id = document.getElementById("video_id").value;
if (newinput != input) {
    input = newinput;

}
var saveData = $.ajax({
    type: "POST",
    url:   "lectures/video/",
    data: {"value": input,   "video_id" : video_id},
  dataType: "text",
  success: function(resultData){

  }
});


}

我只是调用了函数

对于您的问题类型，使用表单，只需搜索 Django 表单，您就会找到足够的信息来解决您的问题 也访问这个问题

creating django forms