javascript - AJAX 调用 python 函数不会从 Django 中的 JavaScript 函数发生

Question

这是一个完整的流程，必须在这里小心。我在 Django/Python/Web 开发中编码。

我有一个 html 页面，它有一个虚拟按钮，它触发了我现在想要执行的所有功能。我想要一个 uploadFunction() 来执行相同的操作，而不是虚拟按钮。我用谷歌搜索，发现最好的方法是使用 AJAX，因为要执行的操作需要访问服务器。

这是我在 jsfunctions.js 文件中的 uploadFunction()

    function upload() {
   //does some upload      
    alert('before dummy')
    ajaxCallFunction();
}

我正在调用另一个单独文件 ajax.js 中的 ajaxCallFunction()。 ajaxCallFunction() 如下:

 $(document).ready(function(){
   function ajaxCallFunction(){
    alert('right before ajax call')
     $.ajax({
        type: "POST",
        url: "/dummy/{{ frame.slug }}/",
        alert('AJAX CALL');
        data: {
        'snapshot' : $('#snapshot').val(),
        },
        success: dummy,
        dataType: 'html'
        alert('just finished')
        }
        headers:{
            'X-CSRFToken':csrftoken
        }
    });
}
});    

function dummySuccess(data, textStatus, jqXHR)
{
    $('#dummySuccess').html(data)
}

我希望我的 upload() 调用 ajaxCallFunction() 并将其重定向到 views.py 中的一个方法(我已将其映射到我的 urls.py 中)。但是，我的代码根本没有命中 ajaxCallFunction。(我看不到我放在 ajaxCallFunction 中的警报)。在我的调用页面中，我包含了所有这些内容。

<script language="javascript" type="text/css"> </script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>        
<script language="javascript" src ="/static/js/jsfunctions.js"></script>
<script language="javascript" src ="/static/js/ajax.js"></script>

我的 ajax.js 中也有获取 CSRF Token 的函数(因为这是一个 post 方法)。我在这里错过了什么吗？我还需要做什么才能进行此 ajax 调用？请帮忙。提前致谢:)

Answer 1

在 JavaScript 中，加载 .js 文件的顺序很重要。您是否尝试过在 jsfunctions.js 之前加载 ajax.js？

基本上，当 jsfunctions.js 在浏览器中加载时，如果 ajax.js 尚未加载，则 undefined 中的函数。

此外，请确保在 ajax 调用的 data 中存在一个名为 'csrfmiddlewaretoken' 的字段。从可维护性的 Angular 来看，您可以将数据保存在一个表单中，然后在将其发送到后端时序列化，而不是直接处理数据。像这样:

<form id="my-form" method="POST" action="/dummy/{{ frame.slug }}/">
    {% csrf_token %}
    <input name="whatever" value="your_data_goes_here" />
</form>

然后在你的 ajax 调用中:

var form = $('#my-form');
$.ajax({
    type: form.attr('method'),
    url: form.attr('action'),
    data: form.serialize(),
    success: function() {
        alert("Huzzah!");
    },
    error: function() {
        alert("Oh no!");
    }
});

最后，在您的 views.py 中，您可以处理您的数据:

if "whatever" in request.POST:
    my_data = request.POST.get("whatever")