本文介绍了django-autocompletion-light简单的外键完成显示不可编辑的下拉窗口小部件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个国家模型:

  class Country(models.Model):
name = models。 CharField(max_length = 200)

def __str __(self):
return self.name

UserDetails模型中的外键引用:

  class UserDetails(models.Model) :

...
country = models.ForeignKey(Country,verbose_name ='Country',null = True,blank = True,default = None)

通过使用django-autocomplete-light,我会点亮,当插入国家时,我有一个文本小部件,完成写第一个字母。 / p>

因此,我准备了:

  class CountryAutocomplete(autocomplete.Select2QuerySetView )
def get_queryset(self):

qs = Country.objects.all()

如果self.q:
qs = qs。 filter(name__istartswith = self.q)

返回qs

使用urls.py:

  app_name ='shared'
urlpatterns = [
url(
r'^ country-autocomplete / $',
CountryAutocomplete.as_view(),
name ='country-autocomplete',
),
]

对于UserDetails表单:

  class UserDetailsForm(forms.ModelForm):

country = forms.ModelChoiceField(
queryset = Country.objects.all(),
widget = autocomplete.ModelSelect2(url ='shared:country-autocomplete')


class Meta:
model = UserDetails
fields = [...,country]

作为一个模板我使用过:

  {%load static%} 


{%block content%}
< form method =postaction =。>
{%csrf_token%}
{{user_form.as_p}}
{{user_details_form.as_p}}
< input type =submitvalue =Submit/> ;
< / form>
{%endblock%}

{%block footer%}
< script type =text / javascriptsrc ={%static'admin / js / jquery / jquery.js'%}>< / script>
< link rel =stylesheettype =text / csshref ={%static'autocomplete_light / select2.css'%}/>
< script type =text / javascriptsrc ={%static'autocomplete_light / jquery.init.js'%}>< / script>
< script type =text / javascriptsrc ={%static'autocomplete_light / autocomplete.init.js'%}>< / script>
< script type =text / javascriptsrc ={%static'autocomplete_light / select2.js'%}>< / script>
< script type =text / javascriptsrc ={%static'autocomplete_light / vendor / select2 / dist / css / select2.css'%}>< / script>
< script type =text / javascriptsrc ={%static'autocomplete_light / vendor / select2 / dist / js / select2.full.js'%}>< / script>
< script type =text / javascriptsrc ={%static'autocomplete_light / forward.js'%}>< / script>
< script type =text / javascriptsrc ={%static'admin / js / vendor / jquery / jquery.js'%}>< / script>
{{form.media}}
{%endblock%}

已将所有静态文件复制到项目根目录中的static文件夹中,并在站点设置中设置了STATIC_URL ='/ static /'。
在进行get调用时,runserver日志记录会给出静态文件:

  [23 / Oct / 2016 17 :44:59]GET / accounts / register / HTTP / 1.1200 2344 
[23 / Oct / 2016 17:44:59]GET /static/admin/js/vendor/jquery/jquery.js HTTP / 1.1304 0
[23 / Oct / 2016 17:44:59]GET /static/autocomplete_light/autocomplete.init.js HTTP / 1.1304 0
[23 / Oct / 2016 17:44:59]GET /static/autocomplete_light/select2.js HTTP / 1.1304 0
[23 / Oct / 2016 17:44:59]GET /static/autocomplete_light/select2.css HTTP / 1.1304 0
[23 / Oct / 2016 17:44:59]GET /static/autocomplete_light/jquery.init.js HTTP / 1.1304 0
[23 / Oct / 2016 17: 44:59]GET /static/autocomplete_light/vendor/select2/dist/css/select2.css HTTP / 1.1304 0
[23 / Oct / 2016 17:44:59]GET / static / autocomplete_light /vendor/select2/dist/js/select2.full.js HTTP / 1.1304 0
[23 / Oct / 2016 17:44:59]GET /static/autocomplete_light/forward.js HTTP / 1.1 304 0
[23 / Oct / 2016 17:44:59]GET / static / admin / js / vendor / j query / jquery.js HTTP / 1.1304 0

当我直接发送到自动完成视图,我得到了一个结果,我期望:

  http://127.0.0.1:8000/shared/country-autocomplete/ ?q = u 

{pagination:{more:false},results:[{text:USA,id:3}]}

但是,如果我去注册表单,对于国家/地区字段,我得到这样一个小部件:





这是空的,无法编辑。
如何在打字时使用建议国名的文本小部件?

解决方案

问题是我导入一个css作为一个javascript文件,
更改

 < script type =text / javascriptsrc ={ %static'autocomplete_light / vendor / select2 / dist / css / select2.css'%}>< / script> 

to:

 code>< link rel =stylesheettype =text / csshref ={%static'autocomplete_light / vendor / select2 / dist / css / select2.css'%}/> 

自动填充按照需要工作。


I have a model for countries:

    class Country(models.Model):
        name = models.CharField(max_length=200)

    def __str__(self):
        return self.name

That is referred by a foreign key in the UserDetails model:

    class UserDetails(models.Model):

        ...
        country = models.ForeignKey(Country,verbose_name='Country',null=True, blank=True, default = None)

By using django-autocomplete-light I would light that when inserting the country I have a text widget that completes while writing the first letters.

Thus, I have prepared:

    class CountryAutocomplete(autocomplete.Select2QuerySetView):
        def get_queryset(self):

            qs = Country.objects.all()

        if self.q:
            qs = qs.filter(name__istartswith=self.q)

        return qs

With urls.py:

    app_name='shared'
    urlpatterns = [
        url(
            r'^country-autocomplete/$',
            CountryAutocomplete.as_view(),
            name='country-autocomplete',
        ),
    ]

And for the UserDetails form:

    class UserDetailsForm(forms.ModelForm):

        country = forms.ModelChoiceField(
            queryset=Country.objects.all(),
            widget=autocomplete.ModelSelect2(url='shared:country-autocomplete')
            )

        class Meta:
            model = UserDetails
            fields = [...,"country"]

As a template I have used:

{% load static %}


{% block content %}
<form method="post" action=".">
    {% csrf_token %}
    {{ user_form.as_p }}
    {{ user_details_form.as_p }}
    <input type="submit" value="Submit" />
</form>
{% endblock %}

{% block footer %}
    <script type="text/javascript" src="{% static 'admin/js/vendor/jquery/jquery.js' %}"></script>
    <link rel="stylesheet" type="text/css" href="{% static 'autocomplete_light/select2.css' %}" />
    <script type="text/javascript" src="{% static 'autocomplete_light/jquery.init.js' %}"></script>
    <script type="text/javascript" src="{% static 'autocomplete_light/autocomplete.init.js' %}"></script>
    <script type="text/javascript" src="{% static 'autocomplete_light/select2.js' %}"></script>
    <script type="text/javascript" src="{% static 'autocomplete_light/vendor/select2/dist/css/select2.css' %}"></script>
    <script type="text/javascript" src="{% static 'autocomplete_light/vendor/select2/dist/js/select2.full.js' %}"></script>
    <script type="text/javascript" src="{% static 'autocomplete_light/forward.js' %}"></script>
    <script type="text/javascript" src="{% static 'admin/js/vendor/jquery/jquery.js' %}"></script>
    {{ form.media }}
{% endblock %}

I have copied all the static files in a folder called 'static' in the root of the project, and I have set STATIC_URL='/static/' in the site settings.While doing the get call, the runserver logging gives for the static files:

[23/Oct/2016 17:44:59] "GET /accounts/register/ HTTP/1.1" 200 2344
[23/Oct/2016 17:44:59] "GET /static/admin/js/vendor/jquery/jquery.js HTTP/1.1" 304 0
[23/Oct/2016 17:44:59] "GET /static/autocomplete_light/autocomplete.init.js HTTP/1.1" 304 0
[23/Oct/2016 17:44:59] "GET /static/autocomplete_light/select2.js HTTP/1.1" 304 0
[23/Oct/2016 17:44:59] "GET /static/autocomplete_light/select2.css HTTP/1.1" 304 0
[23/Oct/2016 17:44:59] "GET /static/autocomplete_light/jquery.init.js HTTP/1.1" 304 0
[23/Oct/2016 17:44:59] "GET /static/autocomplete_light/vendor/select2/dist/css/select2.css HTTP/1.1" 304 0
[23/Oct/2016 17:44:59] "GET /static/autocomplete_light/vendor/select2/dist/js/select2.full.js HTTP/1.1" 304 0
[23/Oct/2016 17:44:59] "GET /static/autocomplete_light/forward.js HTTP/1.1" 304 0
[23/Oct/2016 17:44:59] "GET /static/admin/js/vendor/jquery/jquery.js HTTP/1.1" 304 0

When I send a get directly to the autocomplete view, I get as a result what I expect:

http://127.0.0.1:8000/shared/country-autocomplete/?q=u

{"pagination": {"more": false}, "results": [{"text": "USA", "id": 3}]}

However, if I go to the registration form, for the country field, I get such a widget:

That is empty and cannot be edited.How can I have a text widget that suggest country names while typing letters?

解决方案

The problem was that I imported a css as a javascript file, changing

<script type="text/javascript" src="{% static 'autocomplete_light/vendor/select2/dist/css/select2.css' %}"></script>

to:

<link rel="stylesheet" type="text/css" href="{% static 'autocomplete_light/vendor/select2/dist/css/select2.css' %}" />

the autocompletion worked as wanted.

这篇关于django-autocompletion-light简单的外键完成显示不可编辑的下拉窗口小部件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

10-29 13:21