Django - Google Maps API - 通过表单将 JS 变量传递给 view.py

Question

我的知识有很多空白，所以我可能试图以错误的方式解决这个问题。目标是使用这个Google Maps JavaScript API 自动完成和解析地址输入，并将结果保存在模型中。

我找不到将变量从 JS 直接传递给 view.py 的方法，所以现在计划是让 JS 填充隐藏字段 as suggested by a previous unsolved question。

ModelForm 生成的字段可以用于此目的吗？如果没有，应该如何创建表单，让JS填写字段，字段隐藏且用户不可更改，并且使用csrf_token？

这就是我目前所拥有的一切。有一堆 input 字段由 JS 自动填充。 ModelForm 生成的 form|crispy 不会被填充，即使 id 相同（models.py 中的字段名称与 Google 的命名方案相同）。我不明白 JS 的最后一段是如何工作的，这可能是我卡住的地方。

更新： 下面的代码没有给出POST，为什么？

<!-- language: lang-js -->

$.ajax({
    type: 'POST',
    url: 'http://localhost:8000/place/new',
    dataType: 'json',
    data: {
        csrfmiddlewaretoken: '{{ csrf_token }}',
        address: 'test'
    },
    success: function (response, textStatus, error) {
        console.log('SUCCESS')
    },
    error: function (request, textStatus, error) {
        console.log('error')
        console.log(place)
    }
});
<!-- end snippet -->

<!-- language: lang-python -->

def placenew(request):
    if request.method == 'POST':
        test = request.POST.get('address')
        response_data = {}
        print (test)
        print ("^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^")
        return render(request, 'app/placenew.html', {'key':key})
    else:
        print ("not POST")
        return render(request, 'app/placenew.html', {'key':key})

<!-- end snippet -->

Answer 1

如果您想将变量从 JS 传递到 django，那么您可以查看将 ajax 请求发布到您的视图并在 data 属性中提供您想要的任何数据。

例如，我正在使用 Knockout JS 做这件事，所以我有这个 ajax 请求；

$.ajax({
    url: URLS.design,
    method: 'POST',
    data: {
        data: ko.mapping.toJSON(structure_data)
    },
    success: function (response, textStatus, error) {
        console.log('SUCCESS')
    },
    error: function (request, textStatus, error) {
        console.log('error')
    }
});

您可以获取字段值、变量或您想要的任何其他内容，并将它们传递到$.ajax 的data 属性中。

或者，您可以使用 HiddenInput() 小部件在您的 ModelForm 中设置字段，以便您的 javascript 可以填充它们，而您的用户无需担心它们。然后，如果它们被正确填充，您可以只发布表单并将您的数据发送到视图。

要了解 Ajax，这看起来是一篇很棒的文章； https://realpython.com/blog/python/django-and-ajax-form-submissions/

本质上，url 属性只是在您设置视图的地方，例如/myapp/myview/，然后在您的视图中，它与您处理任何普通 POST 请求的方式非常相似。例如，当我看到上面的 Javascript 代码时，我目前正在这样做；

def get_forms(self, forms):
    data = None

    if self.request.method in ('POST', 'PUT'):

        if self.request.is_ajax():
            _json = self.request.POST.get('data')
            data = json.loads(_json)
        else:
            data = self.request.POST

更新

首先，当你定义你的 URL 时，确保你包含一个斜杠，否则当它到达 Django 时，它会被重定向。所以你会想要url: '/place/new/'。

此外，如果服务器收到 AJAX 请求，您的响应应该返回 JSON。所以你可能会做类似的事情；

def placenew(request):
    if request.method == 'POST':
        test = request.POST.get('address')
        response_data = {}

        if request.is_ajax():
            return HttpResponse(
                json.dumps(response_data),
                content_type="application/json"
            )
        return render(
            request, 'app/placenew.html', {'key':key}
        )
    else:
        print ("not POST")
        return render(request, 'app/placenew.html', {'key':key})

另外，我假设您已按照该教程进行操作，并在提交表单时以某种方式触发的函数中定义了 ajax 调用？