How to use django-autocomplete-light

Question

How do I use django_autcomplete_light to add autocomplete to one field in a form. I have a form which is based off of a model, and I want to add autocomplete to the firstname field.

I have done the following so far:

Install django_autocomplete_light

Changed the INSTALLED_APPS:

INSTALLED_APPS = (
  'autocomplete_light',
  'django.contrib.admin',
   ...

Added it to urls.py, here is my urls.py:

from django.conf.urls import include, url from django.contrib import admin

urlpatterns = [
    url(r"^admin/", include(admin.site.urls)),
    url(r"^app/", include("app.urls")),
    url(r"^autocomplete/", include("autocomplete_light.urls")),
    url(r"^.*$", include("app.urls")),
]

Created a file called autocomplete_light_registry.py and added the following:

import autocomplete_light as al
from .models import *

al.register(Person,
    search_fields = ["^firstname"],
    attrs={
        "placeholder":"First name",
        "data-autocomplete-minimum-characters":1,
    },
    widget_attrs={
        "data-widget-maximum-values":4,
        "class":"modern-style",
    },
)

changed my PersonForm from:

class PersonForm(forms.ModelForm)

to:

class PersonForm(autocomplete_light.ModelForm)

    class Meta:
        model = Person
        autocomplete_fields = ("firstname")

I also added the following line to the html page for the form:

{% include 'autocomplete_light/static.html' %}

And I imported all the necessary jquery files

But the autocomplete does not appear. I don't get any errors. I followed the documentations tutorial.

I am using python manage.py runserver to run the application.

EDIT:

I changed the urlpatterns to (made the django-autocomplete-light url first):

urlpatterns = [
    url(r"^autocomplete/", include("autocomplete_light.urls")),
    url(r"^admin/", include(admin.site.urls)),
    url(r"^app/", include("app.urls")),
    url(r"^.*$", include("app.urls")),
]

This did not solve the problem though.

Crewelwork

Answer 1

You have to do something different if you are using django-autocomplete-light to search models.CharField. In your form.py you need to add the following widget to the field you want add autocomplete to:

autocomplete_light.TextWidget("PersonAutocomplete")

For example forms.py:

from django import forms
import autocomplete_light
from .models import *

class PersonForm(forms.ModelForm):
    """
    This form is to create new RTN's.  It does not include lastupdateddate and
    lastupdatedby, because these will be automatically filled out.
    """
    class Meta:
        model = Rtn
        autocomplete_fields = ("firstname")
        fields = ["firstname", "lastname", "age"]
        widgets = {
           "firstname":autocomplete_light.TextWidget("PersonAutocomplete"),
        }

You should note that what will appear in the autcomplete will be what you return in the __str__ or __unicode__ function in your models class. In my example my Persons class had the following __unicode__ method:

def __unicode__(self):
  return "{0} {1}".format(self.firstname, self.lastname)

So what is shown in the text field that is being autocomplete will be the full name of the person not just the first name, and if you select one the full name is entered into the field.

Crewelwork

This does not seem to work for dal 3.x. Is there any workaround? – Organon

Answer 2

According to this tutorial, I think your code does not make sense. You need a foreign key or many-to-many relation with another model (not just one as in your example) to autocomplete a form field. In the tutorial example, birth_country is autocompleted in PersonForm like this:

//forms.py

class PersonForm(forms.ModelForm):
class Meta:
    model = Person
    fields = ('__all__')
    widgets = {
        'birth_country': autocomplete.ModelSelect2(url='country-autocomplete')
    }

The form represents all Person fields and overwrites birth_country to be autocompleted.

Furthermore, be told that the dal plugin is already in version 3 and very different from your code.

Tourane

I don't see anywhere in the tutorial which specifically states: "You need a foreign key or many-to-many relation with another model (not just one as in your example) to autocomplete a form field." – Bolick