#StackBounty: #django #autocomplete Autocomplete does nothing. What is wrong?

Bounty: 50

I have autocomplete code which does not work.

I have input field class Coordinate where when i type code it finds value from my DB that matches with geo_code and hence finds the input code country.

So when i type UK it matches with geo_code and then matches the last with the country so in this case UK is code i type it can be found in geo_code and country is United Kingdom. The code works, what i want to achieve is bring autocomplete to give suggestions while typing:

for examples: when i type U the field to bring suggestions in this format:

UK   United Kingdom
USA  United States of America

What i did so far:

In models.py i have:

class Coordinate(models.Model):
    code = models.CharField(max_length=150)

class Profiles(models.Model):
    geocode=models.CharField(max_length=200)
    country=models.CharField(max_length=500)

    class Meta:
        managed=False
        db_table='profiles_country'

    def __str__(self):
        return '{}'.format(self.geocode)

in forms.py:

from dal import autocomplete

class CoordinateForm(forms.ModelForm):
    code= forms.CharField(max_length=150, label='',widget= forms.TextInput)

    class Meta:
        model = Coordinate
        fields = ('__all__')
        widgets = {
            'code': autocomplete.ModelSelect2(url='coordinate-autocomplete',
            attrs={ 'theme': 'bootstrap'})}

    def clean_code(self):
            code=self.cleaned_data.get("code")
            if not Profiles.objects.filter(geocode=code).exists():
                raise forms.ValidationError ( "Not true")
            return code

in views.py:

from dal import autocomplete

def geoview(request):
    form = CoordinateForm(request.POST or None)
    if request.method == "POST":
        if form.is_valid():
            form1 = form.save(commit=False)
            code = form1.code
            dataview=Profiles.objects.get(geocode=code)

            context={'geodata':dataview ,}

            return render(request, 'cgeo/result.html', context)

    return render(request, 'cgeo/search.html', context={'form':form})


class CoordinateAutocomplete(autocomplete.Select2QuerySetView):
        def get_queryset(self):
            if not self.request.user.is_authenticated():
                return Profiles.objects.none()
            qs = Profiles.objects.all()
            if self.q:
                qs = qs.filter(name__istartswith=self.q)
            return qs

in main urls.py:

urlpatterns = [
    path('admin/', admin.site.urls),
    path('geo/', geoview, name='geo'),
    path('coordinate-autocomplete/', CoordinateAutocomplete.as_view(create_field='name'), name='coordinate-autocomplete'),]

in base.html

<!DOCTYPE html>
{% load static %}

<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">

    <link rel="stylesheet" href="{% static 'geoproj/css/main.css' %}">

  </head>
  <body>

    <div>{% block content %}{% endblock  %} 

         {% block javascripts %} {% endblock %} </div>

  </body>
</html>

in geo.html :

{% extends "base.html" %}
{% block content %}

{% if user.is_authenticated %}
            <form enctype="multipart/form-data" method="POST" >
                    {% csrf_token %}
                    {{ form}}
                    {{form.media }}
            <button class = "btn btn-primary" type="submit">OK</button></form>


{% endif %}

{% endblock content %}

{% block javascripts %} {% endblock %}

I don’t know where exactly is the problem. What excat js links to put as different sources put different links of js and still does not work for me.

I would appreciate you help to solve this case.


Get this bounty!!!

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.