How to use django-autocomplete-light

abden003 picture abden003 · Jul 24, 2015 · Viewed 10.4k times · Source

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.

Answer

abden003 picture abden003 · Jul 30, 2015

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.