smart selects not working

Using Django Forms & APIs
1

I followed all smart selects documentation and its still not working it shows an empty dropdown list

INSTALLED_APPS = [
....
'smart_selects'
....
]

Project urls.py

urlpatterns = [
....
path('chaining/', include('smart_selects.urls')),
....
]

models.py

from django.contrib.auth.models import AbstractUser
from smart_selects.db_fields import ChainedForeignKey

class CitiesCity(models.Model):
    id = models.BigAutoField(primary_key=True)
    name = models.CharField(max_length=200)
    slug = models.CharField(max_length=255, blank=True, null=True)
    name_std = models.CharField(max_length=200)
    # location = models.GeometryField()
    population = models.IntegerField()
    elevation = models.IntegerField(blank=True, null=True)
    kind = models.CharField(max_length=10)
    timezone = models.CharField(max_length=40)
    country = models.ForeignKey('CitiesCountry', models.DO_NOTHING)
    region = models.ForeignKey('CitiesRegion', models.DO_NOTHING, blank=True, null=True)
    subregion = models.ForeignKey('CitiesSubregion', models.DO_NOTHING, blank=True, null=True)

    def __str__(self):
        return self.name
     
    class Meta:
        managed = False
        db_table = 'cities_city'
        unique_together = (('country', 'region', 'subregion', 'id', 'name'),)

class CitiesCountry(models.Model):
    id = models.BigAutoField(primary_key=True)
    name = models.CharField(max_length=200)
    slug = models.CharField(max_length=255, blank=True, null=True)
    code = models.CharField(unique=True, max_length=2)
    code3 = models.CharField(unique=True, max_length=3)
    population = models.IntegerField()
    area = models.IntegerField(blank=True, null=True)
    currency = models.CharField(max_length=3, blank=True, null=True)
    currency_name = models.CharField(max_length=50, blank=True, null=True)
    language_codes = models.CharField(max_length=250, blank=True, null=True)
    phone = models.CharField(max_length=20)
    tld = models.CharField(max_length=5)
    capital = models.CharField(max_length=100)
    continent = models.ForeignKey(CitiesContinent, models.DO_NOTHING, blank=True, null=True)
    currency_symbol = models.CharField(max_length=31, blank=True, null=True)
    postal_code_format = models.CharField(max_length=127)
    postal_code_regex = models.CharField(max_length=255)

    def __str__(self):
        return self.name

    class Meta:
        managed = False
        db_table = 'cities_country'

class NewUser(AbstractUser):
    uuid = models.UUIDField(primary_key=True,default=uuid.uuid4, editable=False, max_length=36)
    mobile = PhoneNumberField(region="EG")
    street= models.CharField(max_length=200, null=True, blank=True)
    Building= models.CharField(max_length=200, null=True, blank=True)
    Floor= models.IntegerField(null=True, blank=True)
    Flat= models.IntegerField(null=True, blank=True)
    Landmark= models.TextField(null=True, blank=True)
    country = models.ForeignKey(CitiesCountry, on_delete=models.CASCADE, null=True, blank=True)
    city = models.ForeignKey(CitiesCity, on_delete=models.CASCADE, blank=True, null=True)
    district = models.ForeignKey(CitiesDistrict, on_delete=models.CASCADE, blank=True, null=True)
    categories = models.ForeignKey(category, on_delete=models.CASCADE, blank=True, null=True)
    city = ChainedForeignKey(CitiesCity, chained_field ='country', chained_model_field='name', 
    show_all=False, auto_choose=True, sort=True, null=True, blank=True)

forms.py

from django.contrib.auth.forms import UserCreationForm
from django import forms
from .models import NewUser

class CustomUserCreationForm(UserCreationForm):
    class Meta:
        model = NewUser
        fields = ['first_name', 'last_name', 'email', 'username', 'password1', 'password2', 'mobile', 'street', 'Building', 'Floor', 'Flat', 'Landmark', 'country', 'city']

    
    def __init__(self, *args, **kwargs):
        super(CustomUserCreationForm, self).__init__(*args, **kwargs)

        for name, field in self.fields.items():
            field.widget.attrs.update({'class': 'textbox'})
2

Side note: When posting code, templates, error messages, etc here, enclose the code between lines of three backtick - ` characters. This means you’ll have a line of ```, then your code, then another line of ```. This forces the forum software to keep your code properly formatted.
(I’ve taken the liberty of editing this post for you. Please remember to do this in the future.)

3

One of the issues is that you have city defined twice in NewUser. The docs at 3. Chained Selects — django-smart-selects 1.6.0.post3+g699426b documentation show that they replace the country field in their Location model, not add to it.

You did not specify which urls.py file you are showing here. Please confirm that this is your project’s urls.py file and not an app urls.py file being included from the base urls.py.

Additionally, you are not showing the template in which you are rendering these forms. Did you add the JavaScript files to your template as described?

4

Another side note:

This is wrong.

You should not have password1 and password2 in your fields list - they are not fields in the model. AbstractBaseUser only has a password field, which is populated by hashing password1 after being validated.

Those fields should be defined as standard Form fields within the form. See django.contrib.auth.forms.BaseUserCreationForm for an example of how it should be done, including the example of how to hash the submitted password to populate the password field.

1 Like
5

the urls.py is for the project not the app, template:

<div class = "login_textbox1">
                    <label for="formInput#text">{{form.country.label}}</label>
                    {{form.country}}
                    {% for error in form.country.errors %}
                    <p  class="error">{{error}}</p>
                    {% endfor %}
                </div>
                <br><br>
                <div class = "login_textbox1">
                    <label for="formInput#text">{{form.city.label}}</label>
                    {{form.city}}
                    {% for error in form.city.errors %}
                    <p  class="error">{{error}}</p>
                    {% endfor %}
                </div>

this is all i added for the JavaScript

settings.py
JQUERY_URL = False
USE_JQUERY_DJANGO = True

i added the in my base.html

but i am getting an error in the console
Uncaught ReferenceError: jQuery is not defined
at bindfields.js:85:3
(jQuery || django.jQuery));

6

Please show what you added to your base.html

7

base.html

<!DOCTYPE html>
{% load static %}
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="{% static 'styles/main.css' %}">
    <link rel="stylesheet" href="{% static 'styles/bootstrap.css' %}">
    <script src="{% static 'js/main.js' %}"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">
    <title>{% block title %}{% endblock title %} | Smsm</title>
</head>
<body>
    {% include 'layouts/navbar.html' %}

    {% block content %}
    
    {% endblock content %}
</body>
<!-- Bootstrap -->
<script type="text/javascript" src={% static 'js/bootstrap.js' %}></script>
<!-- Smart Selects -->
<script src={% static 'js/chainedfk.js' %}></script>
<script src={% static 'js/bindfields.js' %}></script>
{% block script %}

{% endblock script %}
</html>
8

I can find no setting by this name.

9

mistyping it should be USE_DJANGO_JQUERY = True
https://django-smart-selects.readthedocs.io/en/latest/settings.html

10

this is my models.py

class NewUser(AbstractUser):
    uuid = models.UUIDField(primary_key=True,default=uuid.uuid4, editable=False, max_length=36)
    mobile = PhoneNumberField()
    street= models.CharField(max_length=200, null=True, blank=True)
    Building= models.CharField(max_length=200, null=True, blank=True)
    Floor= models.IntegerField(null=True, blank=True)
    Flat= models.IntegerField(null=True, blank=True)
    Landmark= models.TextField(null=True, blank=True)
    country = models.ForeignKey(CitiesCountry, on_delete=models.CASCADE, blank=True, null=True)
    # city = models.ForeignKey(CitiesCity, on_delete=models.CASCADE, blank=True, null=True)
    district = models.ForeignKey(CitiesDistrict, on_delete=models.CASCADE, blank=True, null=True)
    categories = models.ForeignKey(category, on_delete=models.CASCADE, blank=True, null=True)
    city = ChainedForeignKey(CitiesCity, chained_field ='country', chained_model_field='name', show_all=False, auto_choose=True, sort=True, null=True, blank=True)

even the country is not working the fields are shown when i click on the dropdown field but when i select a country the field clears.
as shown in the attached video.