javascript - 如何使用 django 表单和 javascript 来自动完成字段

标签 javascript django google-maps autocomplete

我有一个模型,其中包含诸如名称、地点(地址)、纬度、经度、爱好等字段。

为了获取这些字段,我在 Django 中使用了一个表单。像这样的事情:

from django import forms
from .models import User

class UserForm(forms.ModelForm):
    class Meta:
        model = User
        fields = ["name", "place", "date","hobbies"]
        widgets = {
            'date': SelectDateWidget()
        }

我想使用谷歌地图 API 启用自动完成功能,从这里填写地址: https://developers.google.com/maps/documentation/javascript/examples/places-autocomplete-addressform

并从地点地址本身读取纬度/经度。

在我的 html 中,我将其呈现为:

<form method="POST" action="" enctype='multipart/form-data'>{% csrf_token %}
{{ form.as_p}}
    {{ form.media }}
<input type="submit" value="Submit Post"/>
</form>

但是,我想知道如何将“地点”文本框的“id”链接到启用自动完成功能的 JavaScript 操作?
然后我计划使用 lat/lan 作为隐藏字段来填充它们的值,客户端。

有更好的方法来完成这个任务吗?

最佳答案

Django 使用类似于 id_model_field_name 的 id 名称呈现表单。如果您的模型字段名称是 place,则在表单中该字段的 id 将为 id_place。使用此 ID,您可以启用自动完成 JavaScript 代码。

关于javascript - 如何使用 django 表单和 javascript 来自动完成字段,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44547319/

相关文章:

javascript - 如何强制谷歌地图进入精简模式(无 WebGL)

php - 来自 Canvas 的无效 base64 字符串

javascript - JS - 使用变量设置 Div 背景颜色

javascript - Select2 在使用 select2 ajax 时不允许选择值

javascript - React-Router:使用客户端路由的服务器请求过程?

python - 我想解决 Django NoReverseMatch

django.db.utils.OperationalError : unable to open database file

django:为什么 RequestContext 设置为 context_instance?

javascript - 如何通过javascript从变量中的json google map api获取地理编码纬度和经度?

android - 谷歌地图 Android API v2 : GooglePlayServicesNotAvailableException not thrown anymore