I am new to Django and trying to get familiar with it.
I have two dropdown menu's which are chained. I want to select a country, and from there I want to choose the city from that country.
I am trying to replicate the code from this website:
https://django-select2.readthedocs.io/en/latest/extra.html#chained-select2
I have the following models in models.py
from django.db import models
# Create your models here.
class Country(models.Model):
name = models.CharField(max_length=255)
def __str__(self):
return self.name
class City(models.Model):
name = models.CharField(max_length=255)
country = models.ForeignKey('Country', related_name="cities", on_delete=models.CASCADE)
def __str__(self):
return self.name
My views.py has the following code: from django.shortcuts import render from django import forms
from django_select2.forms import ModelSelect2Widget
from .models import Country, City
# Create your views here.
class AddressForm(forms.Form):
country = forms.ModelChoiceField(
queryset=Country.objects.all(),
label=u"Country",
widget=ModelSelect2Widget(
model=Country,
search_fields=['name__icontains'],
)
)
city = forms.ModelChoiceField(
queryset=City.objects.all(),
label=u"City",
widget=ModelSelect2Widget(
model=City,
search_fields=['name__icontains'],
dependent_fields={'country': 'country'},
max_results=500,
)
)
def start(request):
form = AddressForm()
return render(request, 'startpagina.html', {'form': form})
My HTML has the following code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Chained</title>
{{ form.media.css }}
<script src="https://code.jquery.com/jquery-2.2.4.min.js"
integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
crossorigin="anonymous"></script>
</head>
<body>
<table>
{{ form }}
</table>
<br>
{{ form.media.js }}
</body>
</html>
I populated my country and city models with the following values:
Country: name: Nederland
Country: name: belgie
City: name: Amsterdam, country: Nederland
City: name: Rotterdam, country: Nederland
City: name: Antwerpen, country: belgie
City: name: Brussel, country: Belgie
When i run my django project I do get 2 dropdown menu, but unfortunately they are not linked. This means that when I select Nederland I don't get Amsterdam and Rotterdam, but I get all the cities.
Can somebody tell me what i am missing in my code to get the 2 dropdown menu's linked?
