Chained Selects in Django [Module: django-smart-selects]

I’m trying to use the django-smart-selects Module in order to create dependent dropdown lists. I’ve followed the documentation and defined models in which I used the ‘ChainedForeignKey’ in order to define a link between my companies and my products.

models.py

class Company(models.Model):
    name = models.CharField(max_length=255)

    def __str__(self):
        return self.name


class Product(models.Model):
    company = models.ForeignKey(Company, on_delete=models.CASCADE)
    name = models.CharField(max_length=255)

    def __str__(self):
        return self.name

class Rates(models.Model):
    company = models.ForeignKey(Company, on_delete=models.CASCADE)
    product = ChainedForeignKey(
        Product,
        chained_field = "company",
        chained_model_field = "company",
        show_all = False,
        auto_choose = True,
        sort=True)
     taux_comm_1 = models.FloatField(validators=[MinValueValidator(0), MaxValueValidator(1)])
     taux_comm_2 = models.FloatField(validators=[MinValueValidator(0), MaxValueValidator(1)]) 

Then I have defined a form :

forms.py

class Rates(forms.ModelForm):
    class Meta:
        model = Rates
        fields= ['company', 'product', 'taux_comm_1', 'taux_comm_2']

The data is retrieved from my database and I can select a company from the first dropdown list. The second list (Product), though, is locked. I’ve associated products to companies in my database ( using the foreign key ).

If you guys have any ideas how I could solve that problem, that would be really good. I’ve searched for a similar issue but I couldn’t find anything like it.

Here is a screenshot of the form.

Answer

I used JS Lint brach (https://github.com/digi604/django-smart-selects/tree/js-unlinting-fixes) and it solved the issue.

Reference : https://github.com/digi604/django-smart-selects/issues/258

EDIT: Adding step by step instructions to address the issue:

Step 1: Remove existing version of django-smart-selects. Type pip uninstall django-smart-selects in the terminal.

Step 2: Install the JS-lint branch by typing

pip install git+https://github.com/digi604/django-smart-selects.git@js-unlinting-fixes` 

Step 3: Add 'smart_selects', to the INSTALLED_APPS list in settings.py.

Step 4: Add from smart_selects.db_fields import ChainedForeignKey in models.py of your app.

Step 5: Add the smart_selects urls into your project’s urls.py. This is needed for the Chained Selects and Chained ManyToMany selects. For example:

urlpatterns = patterns('',
url(r'^admin/', include(admin.site.urls)),
url(r'^chaining/', include('smart_selects.urls')),
)

Step 6: You will also need to include jQuery in every page that includes a field from smart_selects. Add USE_DJANGO_JQUERY = True in your project’s settings.py.

Step 7: Add {{ form.media.js }} just before {{ form.as_table }} in your HTML file so that your Django form derived from the Django model reflects the smart-selects features.

I’m using Python 2.7.10 and Django 1.11.

All the best!